dynamically adding options to select list

Question

I have to build two select lists, say, "SpTypes" and "SpNames" in the jqGrid. The SpNames should be built dynamically depending on what value is selected in the SpTypes list. I am using ASP.NET MVC3 framework for the implementation.I created SpTypes in JqGrid using the edittype: "custom" with the custom functions. These functions use document.createElement("select") and document.createElement("option") to build the list.

This is : colModel

{ name: "SpTypes", index: "SpTypes", hidden:true, editable:true,
    editrules: { edithidden: true}, edittype: "custom", 
    editoptions: {
        custom_element: LoadFormSpTypesDDL,
        custom_value:FormSpTypesDDLValue}},                     

{ name: "SpNames", index: "SpNames", editable:true, edittype: "select",
    editoptions: {value: "0:All"}},

I tried to build the SpNames list on the OnChange event of the select element of SpTypes using something like:

This is : Function LoadFormSpTypesDDL (few code lines)

var ddl = document.createElement("select");          
ddl.onchange = function() {                    
      $('#Grid').setColProp('SpNames', { editoptions: { value: "2:Try2"} });
}
  .....

The above code doesnt change the SpNames list options. Can you please guide me as to what am I doing wrong here ?

Thanks for your time.

Look at the **UPDATED 2** part of [the answer](http://stackoverflow.com/a/4480184/315935) which shows how one can implement dependent selects. One don't need to use `edittype: "custom"` in the case. It's important to understand that setting of `editoptions.value` don't change the current editing row or current editing form. So one have to update the ` — Oleg, Mar 27 '12 at 21:29

dynamically adding options to select list

0 Answers0