Jump to content
Larry Ullman's Book Forums
Sign in to follow this  
100yen

How To Load Event In First <Option>

Recommended Posts

Hi, again. One more question:  
 
When I select a primary category from  first <select> menu, the ajax response return and fill the sub category data into  second <select>menu. When this happen, I expect the second <select> menu will automatically call ajax object to retrieve corresponding product data. However, it doesn't work that way. When the second menu loads, it doesn't do anything unless I expand the menu select a option, then it will retrieve the product. 
 
I realized that the reason being is I have only one event 'onchange' assigned to the event listener. So I modified my script to add multiple events:
 
utility.addEvent(utility.$('sub_category_modal'), 'change', load_sub_cat);
utility.addEvent(utility.$('sub_category_modal'), 'load', load_sub_cat);

I add an event listener to watch for 'load' event so that when second <select> first load, it will trigger the same function of load-sub_cat to load subcategories. 

 

So far only the first 'change' event works. The second 'load' event doesn't work, I suspect the 'load' is not the correct type but I am not sure which one will work.  Pleas again give some advise. thanks. 

 

Share this post


Link to post
Share on other sites

100yen, what do you mean by the following?

"When the second menu loads, it doesn't do anything unless I expand the menu select a option, then it will retrieve the product."

 

I can say the following conclusively:

- There is no onload event for select elements.

- You very likely want to use the onchange event. If I'm understanding you correctly, then when you select something from a menu, an Ajax call is made to populate a second menu. When something is selected from that second menu, then you want to load the corresponding product info, yes?

 

Please clarify what you're trying to achieve, as it's not clear.

Thank you.

Share this post


Link to post
Share on other sites

Hi, HartleySan. Thanks for replying. 

 

yes, this thing can be confusing. But you are right about most of part until the second menu is populated.

 

I want a feature similar to jQuery $('#second_select :first').click( ) that It asks the first<option>  to run after it has been populated. Right now I have to pick an option inside the second <select> to make it run (which trigger the 'change' event). 

 

In short,  I want a 'onload' event or something similar so when the second menu is loaded, and it run instantly. 

 

But as you mentioned there is no 'onload' event for select element, then any alternative solution? 

Share this post


Link to post
Share on other sites

Of course there is an alternate solution.

When you populate the second menu, simply grab the value of the first option, and then use that value to make an Ajax call for the product info.

 

That make sense?

  • Upvote 1

Share this post


Link to post
Share on other sites

Hi, HartleySan, 

 

the script is fully work now after follow your instruction. Thanks.

 

What I do is grabbing first option value and making an ajax call insert the handleResponse function of first menu. That solves the problem. 

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

×
×
  • Create New...