javascript - ASP finds dropdown with 0 elements but the elements are there -

i'm using asp selected value in dropdown box. dropdown box choices generated @ load time. here javascript that:

function createdepartmentdropdown(data) {     var dropdown = document.getelementbyid("department_dropdown");     (var = 0; < data.length; i++) {         var array = data[i].split(',');         var option = document.createelement("option");         option.value = array[0];         option.innerhtml = array[1];         dropdown.add(option);     } } 

and looks this:

looks fine me. checked html out sure:

that looks great too. here issue comes up. when press submit delegate fires in c# (still testing while making this):

void activity_submit_click(object sender, eventargs e) {     int fye = int32.parse(fye_dropdown.value);     string activity_name = activity_name_field.value;     string activity_responsible = responsible_field.value;     int department = int32.parse(department_dropdown.value);     string activity_start = datepicker_start.value;     string activity_end = datepicker_end.value; } 

and when debug stops @ department saying it's malformed. looking @ department_dropdown.value in immediate window turns empty string , dropdown has 0 children.

why return empty response when list there? how go fixing this?

the client-side items won't posted server this.

the easiest way serialize array json, put in hidden input element's value :

in markup:

<asp:hiddenfield runat="server" id="department_dropdown_items" cssclass="department_dropdown_items" />  <asp:hiddenfield runat="server" id="department_dropdown_selected" cssclass="department_dropdown_selected" /> 

your javascript:

function createdepartmentdropdown(data) {     var dropdown = document.getelementbyid("department_dropdown");     (var = 0; < data.length; i++) {         var array = data[i].split(',');         var option = document.createelement("option");         option.value = array[0];         option.innerhtml = array[1];         dropdown.add(option);     }     $(".department_dropdown_items").text(json.stringify(data)); }  $(document).ready(function() {     $("form").submit(function(e) {          $(".department_dropdown_selected").text( $("#department_dropdown").value);     }); }); 

then use in code behind:

void activity_submit_click(object sender, eventargs e) {     string[] data = new javascriptserializer().deserialize<string[]>(department_dropdown_items.value);     string selectedvalue = department_dropdown_selected.value;      int fye = int32.parse(fye_dropdown.value);     string activity_name = activity_name_field.value;     string activity_responsible = responsible_field.value;     int department = int32.parse(department_dropdown.value);     string activity_start = datepicker_start.value;     string activity_end = datepicker_end.value; } 

the code not tested. tell me if it's not working :)