There are may errors in your code. It looks like you used some retro code example which is at least 3 years old.
The main error in the server code is usage of JsonConvert.SerializeObject
inside of web method. If you defines ResponseFormat=ResponseFormat.Json
then the method should return object of any type and not string
. .Net convert the object automatically to JSON. So the type of return value of GetCompanyList()
should be the same as the return type of GetAllData()
. After the changes the web method should returns the data like
{
"d": [
{
"F1": 1,
"F2": "Name",
"F3": "Address",
"F4": "City",
"F5": "Phone"
},
{
"F1": 10,
"F2": "abc",
"F3": "def",
"F4": "asd",
"F5": "998907"
}
]
}
The second problem that you use datatype
defined as function. It's low-level way which you should never use if you can get the data with respect jQuery.ajax
with some parameters. jqGrid provide a lot of different customization way to change parameters of jQuery.ajax
used by jqGrid internally. Typically it's enough to specify the options like
url: "jqGrid_pureJS.aspx/GetCompanyList",
mtype: 'POST',
datatype: 'json',
ajaxGridOptions: { contentType: 'application/json; charset=utf-8' },
serializeGridData: function (postData) {
return JSON.stringify(postData);
},
jsonReader: {
repeatitems: false,
root: function (obj) { return obj.d; }
},
gridview: true,
height: "auto",
loadonce: true
It's important additionally to remove all index
properties from colModel
. The usage of index
other as name
follows to errors if you use loadonce: true
option.
If F1
column contains unique values then I recommend you to add key: true
property to the definition of the column "F1"
.
The results of the changes should be like on the demo: