CODEWITHSUNDEEP
javascriptjqgrid
Alexandru Severin
Alexandru Severin

Reputation: 6228

Value of dyanamic select in jqGrid not being submitted

I'm trying to create a grid with a column of type select, having dynamic options. The options are populated after the Edit Form is displayed.

My idea was to use the dataInit event as described in this answer.

The model for the column is:

 {name: 'bad', index: 'bad', editable: true, edittype: 'select',
  editoptions: {
    dataInit: function(elem) {
      setTimeout(function() {
        $(elem).empty()
          .append("<option value='1'>Option 1</option>")
          .append("<option value='2'>Option 2</option>");

      }, 50);
    }
  }

The options are correctly populated in the form, but when submitting, the value of the select field is not sent to the controller. I have used the beforeSubmit event to display the data object being sent:

beforeSubmit: function(data, id) {
   alert(JSON.stringify(data));
   // Alerts:     {"":"1","list_id":"_empty"}
   // Notice that "" should be "bad"
}

Test it yourself: http://fiddle.jshell.net/6zaHp/137/

Upvotes: 0

Views: 234

Answers (1)

Oleg
Oleg

Reputation: 221997

I would recommend you to use value: {} for the select, which will be build dynamically.

{name: 'bad', editable: true, edittype: 'select',
  editoptions: {
    value: {},   // <-- Added this line
    dataInit: function(elem) {
      setTimeout(function() {
         $(elem).empty()
                .append("<option value='1'>Option 1</option>")
                .append("<option value='2'>Option 2</option>");
      }, 50);
   }
}

Without the setting jqGrid don't set some required attributes like the name attribute on the <select>. The name attribute will be used to build the property name of the resulting JSON data sent to the server.

See updated the corresponding demo here: http://fiddle.jshell.net/6zaHp/139/

Upvotes: 1

Related Questions