what kind of data for jqGrid select

0
votes

i wanna use select in jqGrid when i try to edit row.

i set colModel like this:

{name:'scenic',index:'scenic',width:90, editable:true,editoptions:{size:"20",maxlength:"30"}, sortable: true,edittype:"select",editoptions:{dataUrl:"/admins/type"}

and my url return data like this:

[{"key":1,"value":"123"},{"key":2,"value":"456"},{"key":3,"value":"789"},{"key":4,"value":"00"}]

but the problem is, i got error in browser when i renturn data like that, so what kind of data should i return and also i can get the row value when i opening edit window. the error is:

Uncaught Error: Syntax error, unrecognized expression: [{"key":1,"value":"123"},{"key":2,"value":"456"},{"key":3,"value":"789"},{"key":4,"value":"00"}]

any help will be appreciate.........:)

2
jqueryajaxjqgrid
always important to provide as much detail about an error as possible... got error isn't very informative – charlietfl
thanks for reminding me.....i just edit it for adding error message.... – Madison Rong
I Updated my answer, Please see it. – hamed

2 Answers

0
votes

Your data format is correct. You need to add formatter to your colModel. Something like this:

{name:'scenic',index:'scenic',width:90, editable:true,editoptions:{size:"20",maxlength:"30"}, formatter: "select"}

Try and I hope that help you.

0
votes

jqGrid expect that dataUrl return HTML fragment with <select><option>...</option>...</select>. If the dataUrl returns JSON data then one should use buildSelect to convert JSON data to the HTML fragment which jqGrid require.

The next error in your code: you specify editoptions property twice which is an syntax error. The code could be something like

{name: "scenic", width: 90, sortable: true,
    editable: true, edittype: "select"
    editoptions: {
        size: "20",
        maxlength: "30",
        dataUrl: "/admins/type",
        buildSelect: function (data) {
             var s = "<select>", i, l, item;
             if (data != null && data.length) {
                 for (i = 0, l = data.length; i < l; i++) {
                     item = data[i];
                     s += '<option value="' + item.key + '">' +
                             item.value + '</option>';
                 }
             }
             return s + "</select>";
        }
    }
}

Additionally you should use ajaxSelectOptions option to inform jQuery.ajax about the format of expected data:

ajaxSelectOptions: { dataType: "json" }

If you don't do this it could be that data in buildSelect will be needed to convert of object using data = $.parseJSON(data.responseText);.