JQUERY: selecting a dropdown based on submitted values

Question

I have a dropdown which you choose one of three values

<select id="FilterType" name="FilterType">
  <option value=''>All</option>
  <option value="LanCode">Lan Code</option>
  <option value="SupportTeamName">Support Team</option>
</select>   

based on what the user chooses another dropdown is created beside that one it will have a bunch of <option value="8">Something</option> then the user submits the form back to itself

I have written a function to set the first dropdown to the submitted value and then repopulate the second dropdown according to the submitted value and then select the item in the dropdown passed to the page...

$('#FilterType').find("option[value*='<%= Request.QueryString("FilterType") %>']").attr('selected','selected');     
getFilter();
$("#<%= findselect %> option[value='<%= findoption %>']").attr('selected',true);

Now the problem is I can't seem set the item selected in the second dropdown. I guess it's because the page is loaded and then the second dropdown is created

How can I set the second dropdown to the value submitted?

Answer 1

• You can move your "select logic" and put it right next the "create logic" CreateSecondDD(); SelectSecondDD();

• Another thing you can do is move your "select logic" just after the end of the tag, this way the script will be called just after page finishes reloading. </body> <script> SelectSecondDD(); </script>

But what i really recommend you to do is, when creating DOM for the Second Dropdown, always check the value from first DropDown, and apply the required selected attribute.

This task is quite easy using jQuery DOM plugin.