I'm new at jQuery and I'm running into a problem where the value I select in a dropdownlist doesn't hold once the postback is hit by a button. My dropdownlist:

 

      < asp : ListItem Text ="" Value =""></ asp : ListItem >

      < asp : ListItem Text ="Male" Value ="M"></ asp : ListItem >

      < asp : ListItem Text ="Female" Value ="F"></ asp : ListItem >

</ asp : DropDownList >

 

Here's my jQuery code:

 

$(document).ready( function () {

SetGender();

}); 　

function SetGender() {

var myval = $( "#<%=_ddlTitle.ClientID%> option:selected" )[0].value;

 

if (myval == 'F' || myval == 'M' ) {

$( "select#<%=_ddlGender.ClientID%>" ).val(myval);

$( "#<%=_ddlGender.ClientID%>" ).attr( 'disabled' , 'true' );

}

else {

$( "#<%=_ddlGender.ClientID%>" ).val( '' );

$( "#<%=_ddlGender.ClientID%>" ).removeAttr( 'disabled' );

}

}

</ script >

 

I have another dropdownlist of Titles, when a title is selected, it sets the gender dropdownlist (above) if it is a gender specific title (i.e. Mr. -> Male).  As it is now, the gender is selected perfectly.  The problem however exists when my "Continue" button is pressed.  On its event hanler, it checks my gender dropdownlist to validate that a gender has been selected.  It cannot have a SelectedValue = "", yet that is exactly what I have even though the text of the dropdownlist shows Male or Female.  Even after the button's postback, the text shows Male or Female, yet when I look at it in Firebug, the Selected="selected" is on the first item in the gender dropdownlist. 

 

Any ideas on how to keep the real selected value after the button's postback?  Thanks