Your data has no id
properties. It seems that ProductID
play the role of id of your data. So you should use additional key:true
option in the definition of the ProductID
column or include 'id:ProductID' in the jsonReader
.
Moreover the Label
property should be written in low case: label
. It replace the value from the column header colNames
. If you use label
property for all columns you not need more define colNames
array.
If you want to fill the jqGrid with the local data the most effective way is to use addRowData function. In the case you should use localReader
instead of jsonReader
. It can be used to add not only a row, but an array of row data. In the case of arrays as data the first parameter should be the name of id property. So your code could look like following:
var myData = [
{ ProductID: '1', Name: 'Coke' },
{ ProductID: '2', Name: 'Pepsi' },
{ ProductID: '3', Name: 'L&P' },
{ ProductID: '4', Name: 'A&B' },
{ ProductID: '5', Name: 'All Star' },
{ ProductID: '6', Name: 'Wai' },
{ ProductID: '7', Name: 'cd' },
{ ProductID: '8', Name: 'LV' },
{ ProductID: '9', Name: 'DD' },
{ ProductID: '10', Name: 'aW' }
];
jQuery("#grid").jqGrid ('addRowData', 'ProductID', myData);
If all this will not help, you should include in your question the whole code which can be used to reproduce your problem.