Related
My subgrid only shows the column headers but not not load the json data from the main grid. The columns are empty. I followed the tutorial on JQuery Grid-SubGrid for Parent-Child relation
but it does not work.
This is my javascript code:
jQuery().ready(function () {
var grid = jQuery("#shipment_grid");
var mainGridPrefix = "s_";
grid.jqGrid({
url: '${pageContext.request.contextPath}/getTruckShipmentJSONAction?truckId=' + <c:out value="${truckId}" />,
datatype: "json",
mtype: 'GET',
loadonce: true,
colNames: ['Lead Tracking #'],
colModel: [
{name: 'trackingNr', index: 'trackingNr', width: 100, align: 'left'}
],
rowNum: 10,
height: 230,
width: 700,
idPrefix: mainGridPrefix,
autoheight: true,
rowList: [10, 20, 30],
pager: jQuery('#shipment_grid_pager'),
sortname: 'trackingNr',
sortorder: "desc",
jsonReader: {
root: "records",
page: "page",
total: "total",
records: "rows",
repeatitems: false
},
viewrecords: true,
altRows: false,
gridview: true,
multiselect:true,
hidegrid: false,
shrinkToFit: true,
forceFit: true,
idPrefix: mainGridPrefix,
caption: "Shipments Overview",
subGrid: true,
beforeProcessing: function(data) {
//align 'Lead Tracking #' column header to the left
grid.jqGrid ('setLabel', 'trackingNr', '', {'text-align':'left'});
var rows = data.rows, l = rows.length, i, item, subgrids = {};
for (i = 0; i < l; i++) {
item = rows[i];
if (item.shipUnitView) {
subgrids[item.id] = item.shipUnitView;
}
}
data.userdata = subgrids;
},
subGridRowExpanded: function (subgridDivId, rowId) {
var $subgrid = $("<table id='" + subgridDivId + "_t'></table>"),
pureRowId = $.jgrid.stripPref(mainGridPrefix, rowId),
subgrids = $(this).jqGrid("getGridParam", "userData");
$subgrid.appendTo("#" + $.jgrid.jqID(subgridDivId));
$subgrid.jqGrid({
datatype: "local",
data: subgrids[pureRowId],
colNames: ['Ship Type (Pallet / Carton)', 'Ship Unit (Pallet ID / Cone #)', 'Total Cartons'],
colModel: [
{ name: "shipUnitType", index: 'shipUnitType', width: 100, align: 'center'},
{ name: "reference", index: 'reference', width: 100, align: 'center'},
{ name: "totalOfCartons", index: 'totalOfCartons', width: 100, align: 'center'}
],
sortname: "shipUnitType",
sortorder: "desc",
height: "100%",
rowNum: 10,
autowidth: true,
autoencode: true,
jsonReader: {
root: "records",
records: "rows",
repeatitems: false,
id: "reference" },
gridview: true,
idPrefix: rowId + "_"
});
}
}).navGrid('#shipment_grid_pager', {edit: false, add: false, del: false, search: false, refresh: true});
});
This is my json data from the server:
{"page":1,
"records":[
{"id":2,"trackingNr":"1Z1484366620874728",
"shipUnitView":[{"reference":"65000943","shipUnitType":"CARTON","totalOfCartons":1},
{"reference":"65000942","shipUnitType":"CARTON","totalOfCartons":1}]},
{"id":4, "trackingNr":"1Z1484366620874746"
"shipUnitView":[{"reference":"65000940","shipUnitType":"CARTON","totalOfCartons":1},
{"reference":"65000939","shipUnitType":"CARTON","totalOfCartons":1}]},
{"id":3, "trackingNr":"1Z1484366620874764"
"shipUnitView":[{"reference":"65000938","shipUnitType":"CARTON","totalOfCartons":1},
{"reference":"65000937","shipUnitType":"CARTON","totalOfCartons":1}]}
],
"recordsTotal":3,"rows":10,"sidx":null,"sord":"asc","total":1,"trackingNr":null,"truckId":"174225","truckShipmentComponent":{}}
First of all there are small errors in the JSON data which you posted. It contains no commas after "trackingNr":"1Z1484366620874746" and "trackingNr":"1Z1484366620874764". I hope that it's only cut&paste error during preparing the data for the question. In any way it would be more safe to include loadError callback (see the answer) in case of loading errors.
Your main error seems to me are inside of beforeProcessing callback. The data parameter of the callback contains the server response. The array of items you have inside of data.records, but you use var rows = data.rows, ... instead. The line should be fixed to var rows = data.records, ....
One asked you in the comment to prepare JSFiddle demo which demonstrates the problem and you had problems to prepare it because of usage datatype: "json". On the other side JSFiddle do provides you possibility to implement demos in the case. One can use Echo service. In case of jqGrid one needs just use mtype: "POST" and url: "/echo/json/". To inform echo service which data you want to have one need just send JSON encoded data in json parameter. So the fill looks like
// the data which we want to receive back
var serverResponse = {
"page":1,
...
};
$("#gridId").jqGrid({
url: "/echo/json/", // use JSFiddle echo service
postData: {
json: JSON.stringify(serverResponse) // needed for JSFiddle echo service
},
datatype: "json",
mtype: "POST", // needed for JSFiddle echo service
...
});
The working JSFiddle demo you can find here: http://jsfiddle.net/OlegKi/ntfw57zm/. I makes some small additional optimization of your code.
I hope the example could help other people to post his questions with JSFiddle demos.
I'm trying to populate a JqGrid inside the success function of an Ajax call. My ajax call is passing a date parameter to the function which will filter the results. My grid loads, but no data is displayed and it says Loading... above my grids caption. I'm using a drop down to filter results based on date. My json data has been verified to be valid.
$(document).ready(function () {
$("[name='DDLItems']").change(function () {
var selection = $(this).val();
var dataToSend = {
//holds selected value
idDate: selection
};
$.ajax({
type: "POST",
url: "Invoice/Filter",
data: dataToSend,
success: function (dataJson) {
// alert(JSON.stringify(dataJson));
$("#grid").jqGrid({ //set your grid id
data: dataJson, //insert data from the data object we created above
datatype: json,
mtype: 'GET',
contentType: "application/json; charset=utf-8",
width: 500, //specify width; optional
colNames: ['Invoice_Numbers', 'Amt_Totals','f', 'ff', 't'], //define column names
colModel: [
{ name: 'Invoice_Number', index: 'Invoice_Number', key: true, width: 50 },
{ name: 'Amt_Total', index: 'Amt_Total', width: 50 },
{ name: 'Amt_Due', index: 'Amt_Due', width: 50 },
{ name: 'Amt_Paid', index: 'Amt_Paid', width: 50 },
{ name: 'Due_Date', index: 'Due_Date', width: 50 },
], //define column models
pager: jQuery('#pager'), //set your pager div id
sortname: 'Invoice_Number', //the column according to which data is to be sorted; optional
viewrecords: false, //if true, displays the total number of records, etc. as: "View X to Y out of Z” optional
sortorder: "asc", //sort order; optional
caption: "jqGrid Example", //title of grid
});
},
-- controller
[HttpPost] // Selected DDL value
public JsonResult Filter(int idDate)
{
switch (idDate)
// switch statement goes here
var dataJson = new UserBAL().GetInvoice(date);
return Json(new { agent = dataJson}, JsonRequestBehavior.AllowGet);
Here's the answer if anyone else comes across this. This is what I ended up doing, the rows are getting filtered passed on the date parameter I'm passing to the URL of the function. Having the Grid populate inside the Ajax call also seemed like it was a problem so I had to take it out.
public JsonResult JqGrid(int idDate)
{
switch (idDate)
#region switch date
--Switch Statement--
#endregion
var invoices = new UserBAL().GetInvoice(date);
return Json(invoices, JsonRequestBehavior.AllowGet);
}
[HttpPost] // pretty much does nothing, used as a middle man for ajax call
public JsonResult JqGridz(int idDate)
{
switch (idDate)
#region switch date
--Switch Statement--
#endregion
var invoices = new UserBAL().GetInvoice(date);
return Json(invoices, JsonRequestBehavior.AllowGet);
}
Yes these two functions seem very redundant and they are. I don't know why my post wouldn't update data, but I needed to reload the grid each time and when I did that it would call the first function. So yea the post jqGridz is kinda of just a middle man.
Here's the jquery code I used
var dropdown
var Url = '/Invoice/JqGrid/?idDate=0'
$(document).ready(function () {
$("#jqgrid").jqGrid({
url: Url,
datatype: 'json',
mtype: 'GET', //insert data from the data object we created above
width: 500,
colNames: ['ID','Invoice #', 'Total Amount', 'Amount Due', 'Amount Paid', 'Due Date'], //define column names
colModel: [
{ name: 'InvoiceID', index: 'Invoice_Number', key: true, hidden: true, width: 50, align: 'left' },
{ name: 'Invoice_Number', index: 'Invoice_Number', width: 50, align: 'left'},
{ name: 'Amt_Total', index: 'Amt_Total', width: 50, align: 'left' },
{ name: 'Amt_Due', index: 'Amt_Due', width: 50, align: 'left' },
{ name: 'Amt_Paid', index: 'Amt_Paid', width: 50, align: 'left' },
{ name: 'Due_Date', index: 'Due_Date', formatter: "date", formatoptions: { "srcformat": "Y-m-d", newformat: "m/d/Y" }, width: 50, align: 'left' },
],
pager: jQuery('#pager'),
sortname: 'Invoice_Number',
viewrecords: false,
editable: true,
sortorder: "asc",
caption: "Invoices",
});
$("[name='DDLItems']").change(function () {
var selection = $(this).val();
dropdown = {
//holds selected value
idDate: selection
};
$.ajax({
type: "POST",
url: "Invoice/JqGridz",
data: dropdown,
async: false,
cache: false,
success: function (data) {
$("#jqgrid").setGridParam({ url: Url + selection})
$("#jqgrid").trigger('reloadGrid');
}
})
})
});
Are you actually passing a value to your controller? I see you have data: dataToSend which doesn't match to your controllers idDate.
Is there a reason you are trying to setup your grid this way? Do you not want to deal with paging, or I'm not even sure if your setup would handle rebuild a grid when a user picks the date for a 2nd time.
My personal suggestion would be that you:
setup your grid separately, hidden if you don't want it visible on page load
set it's datatype to local so the grid doesn't load on page load
on the change event:
show the grid
change the postdata parameter the grid has
set the url of the controller/action which will feed the data back to the grid
trigger a grid reload
I have a Jqgrid which requires editing. I have successfully managed to configure the grid to save the data after editing, however the issue is that when the data is saved the grid is not refreshed with the data present in the database. For example the version field is automatically updated by the application backend however after a edit is done it is not refreshed and the old value is shown. I have tried
afterSubmit
afterComplete
which did not work. I also placed an alert in it to verify that the function was called however the alert was not shown either. Additionally I set loadonce to false and reloadaftersubmit to true but this did not work either. I think the issue could be that I either havent configured the edit correctly or placed the above mention parameters in the incorrect location.
After a save is done (edit) the updated data (which is the WHOLE page) is returned to the Jqgrid (as json). The issue here is that the old data is shown and how do I display this updated data after the edit.
UPDATE : I found out that when I edit via the popup box the afterSubmit is executed. HOWEVER the editing takes place via the formatoptions which allows to edit the data in the table itself. Now when the data is edited and saved from the grid itself without the use of the popup I want an afterSubmit to fire to refresh the table. Where do I place my afterSubmit / How do I achieve this.
/**
* Initialize and Draw JQGrid
* #return
*/
function drawFOMJQGrid(){
var lastsel2;
jQuery("#tblGrid").jqGrid({
height: 180,
width:990,
datatype: "json",
colNames:['','Hotel','Outlet','Major Group','Item Group','Version'],
jsonReader : {
root: "regDetails",
page: "page",
total: "total",
records: "records",
repeatitems: false
},
colModel:[
{name: 'myac', width:80, fixed:true, sortable:false, resize:false, formatter:'actions', formatoptions:{keys:true}},
{name:'hotelName',index:'hotelName',align:"left",width:30,resizable:false},
{name:'majorGroupName',index:'majorGroupName',align:"left", width:20,resizable:false},
{name:'itemGroupName',index:'itemGroupName', width:30,align:"left",resizable:false},
{name:'version',index:'version', width:20,align:"right",resizable:false,editable:true,hidden: false}
],
onSelectRow: function(id){
},
/*afterSubmit : function(response, postdata){
alert("AAAA");
},
afterComplete : function(response, postdata){
alert("AAAA2");
}, */
//rowList:[10,20,30],
rowNum:5,
pager: '#divGridPg',
sortname: 'hotelName',
viewrecords: true,
sortorder: "outletName",
gridview: true,
bgiframe: true,
autoOpen: false,
caption: 'POS Item Pricing',
forceFit: false,
loadtext: 'Loading ...',
sortable: true,
loadonce: false,
editurl: "itemPricingSave.action", //"/js/itemPricing/server.js",
datatype: "json"
});
$("#tblGrid")[0].addJSONData(regGridJSONData);
$("#tblGrid").setGridParam({datatype: 'json'});
jQuery("#tblGrid").jqGrid('navGrid','#divGridPg',{edit:true,add:false,del:false,reloadAfterSubmit:true});
}
/**
* Initialize and Draw JQGrid
* #return
*/
function drawFOMJQGrid(){
var lastsel2;
jQuery("#tblGrid").jqGrid({
height: 180,
width:990,
datatype: "json",
colNames:['','Hotel','Outlet','Major Group','Item Group','Version'],
jsonReader : {
root: "regDetails",
page: "page",
total: "total",
records: "records",
repeatitems: false
},
colModel:[
{name: 'myac', width:80, fixed:true, sortable:false, resize:false, formatter:'actions', formatoptions:{keys:true}},
{name:'hotelName',index:'hotelName',align:"left",width:30,resizable:false},
{name:'majorGroupName',index:'majorGroupName',align:"left", width:20,resizable:false},
{name:'itemGroupName',index:'itemGroupName', width:30,align:"left",resizable:false},
{name:'version',index:'version', width:20,align:"right",resizable:false,editable:true,hidden: false}
],
onSelectRow: function(id){
},
/*afterSubmit : function(response, postdata){
alert("AAAA");
},
afterComplete : function(response, postdata){
alert("AAAA2");
}, */
//rowList:[10,20,30],
rowNum:5,
pager: '#divGridPg',
sortname: 'hotelName',
viewrecords: true,
sortorder: "outletName",
gridview: true,
bgiframe: true,
autoOpen: false,
caption: 'POS Item Pricing',
forceFit: false,
loadtext: 'Loading ...',
sortable: true,
loadonce: false,
editurl: "itemPricingSave.action", //"/js/itemPricing/server.js",
datatype: "json"
});
$("#tblGrid")[0].addJSONData(regGridJSONData);
$("#tblGrid").setGridParam({datatype: 'json'});
jQuery("#tblGrid").jqGrid('navGrid','#divGridPg',{edit:true,add:false,del:false,reloadAfterSubmit:true});
}
I did the following to force the grid reload:
.navGrid('#pager',
{edit:true,
add: true,
del:true,refresh:false},
{ // edit options
afterSubmit: function() {
comptes[0].clearToolbar();
comptes.jqGrid('setGridParam',{datatype:'json'}).trigger('reloadGrid');
return [true,'',false]; // no error and no new rowid
}
},
{ // add options
afterSubmit: function() {
comptes[0].clearToolbar();
comptes.jqGrid('setGridParam',{datatype:'json'}).trigger('reloadGrid');
return [true,'']; // no error
}
} ,
{ // delete options
afterSubmit: function() {
comptes[0].clearToolbar();
comptes.jqGrid('setGridParam',{datatype:'json'}).trigger('reloadGrid');
return [true,'']; // no error
}
}
);
Try to reload jqGrid with new data after all your editing process as following:
jQuery("#grid").jqGrid('setGridParam',{datatype:'json'}).trigger('reloadGrid');
I'm using JqGrid with Django framework. That's JS:
jQuery("#list").jqGrid({
url:'{% url views.manage.devicesajax %}',
datatype: 'json',
mtype: 'GET',
colNames:['DID', 'UDID', 'Owner', 'Name', 'First seen', 'Last seen'],
colModel :[
{name:'did', index:'did', width: 30, searchoptions:{sopt:['eq','ne','bw','cn']}},
{name:'udid', index:'udid', width: 120, editable: true, searchoptions:{sopt:['eq','ne','bw','cn']}},
{name:'d_owner', index:'d_owner', width: 70, editable: true, searchoptions:{sopt:['eq','ne','bw','cn']}},
{name:'d_name', index:'d_name', editable: true, searchoptions:{sopt:['eq','ne','bw','cn']}},
{name:'d_firstseen', index:'d_firstseen', width: 80},
{name:'d_lastseen', index:'d_lastseen', width: 80}],
pager: jQuery('#pager'),
rowNum:20,
rowList:[20,50,100],
sortname: 'did',
sortorder: "desc",
multiselect: true,
viewrecords: true,
imgpath: 'themes/basic/images',
caption: 'Devices list',
height: 330,
width: 1000,
onSelectRow: function(id) {
var id = $("#list").getRowData(id).message_id;
message_id = id;
},
editurl: "{% url views.manage.deviceseditajax %}"
});
When I do edit row in JqGrid I get error from editurl:
Forbidden (403)
CSRF verification failed. Request aborted.
It's because csrf_token doesn't pass to editurl with the other data.
How to add csrf_token to the POST request to editurl ?
This code works perfectly ( complete piece of jqgrid init ):
jQuery("#list").jqGrid({
url:'{% url views.manage.devicesajax %}',
datatype: 'json',
mtype: 'GET',
colNames:['DID', 'UDID', 'Owner', 'Name', 'First seen', 'Last seen'],
colModel :[
{name:'did', index:'did', width: 30, searchoptions:{sopt:['eq','ne','bw','cn']}},
{name:'udid', index:'udid', width: 120, editable: true, searchoptions:{sopt:['eq','ne','bw','cn']}},
{name:'d_owner', index:'d_owner', width: 70, editable: true, searchoptions:{sopt:['eq','ne','bw','cn']}},
{name:'d_name', index:'d_name', editable: true, searchoptions:{sopt:['eq','ne','bw','cn']}},
{name:'d_firstseen', index:'d_firstseen', width: 80},
{name:'d_lastseen', index:'d_lastseen', width: 80}],
pager: jQuery('#pager'),
rowNum:20,
rowList:[20,50,100],
sortname: 'did',
sortorder: "desc",
multiselect: true,
viewrecords: true,
imgpath: 'themes/basic/images',
caption: 'Devices list',
height: 330,
width: 1000,
editurl: "{% url views.manage.deviceseditajax %}",
});
jQuery("#list").navGrid('#pager',{edit:true,add:true,del:true,search:true},
{
closeAfterEdit:true,
reloadAfterSubmit:true,
closeOnEscape:true,
editData: {csrfmiddlewaretoken: '{{ csrf_token }}'}
},
{
closeAfterAdd:true,
reloadAfterSubmit:true,
closeOnEscape:true,
editData: {csrfmiddlewaretoken: '{{ csrf_token }}'}
},
{
closeOnEscape:true,
delData: {csrfmiddlewaretoken: '{{ csrf_token }}'}
},
{
caption: "Search",
Find: "Find",
Reset: "Reset",
sopt : ['eq', 'cn'],
matchText: " match",
rulesText: " rules",
closeAfterSearch: true,
afterShowSearch: function ()
{
$('#reset_filter1_block').show();
}
}
);
I don't use Django framework and not familiar with the csrf_token, but after searching in Google it seems that you need to set it in the HTTP header of the request: xhr.setRequestHeader('X-CSRF-Token', csrf_token);. To do this in case of jqGrid you can use loadBeforeSend event handler:
loadBeforeSend: function(jqXHR) {
// you should modify the next line to get the CSRF tocken
// in any way (for example $('meta[name=csrf]').attr('content')
// if you have <meta name="csrf" content="abcdefjklmnopqrstuvwxyz="/>)
var csrf_token = '<%= token_value %>'; // any way to get
jqXHR.setRequestHeader('X-CSRF-Token', csrf_token);
}
See here for a very close problem.
UPDATED: To post additional data in case of form editing usage you can use editData: editData: { csrfmiddlewaretoken:'<%= token_value %>' }. For example:
jQuery("#list").jqGrid('navGrid','#pager',{},
{ // Edit option (parameters of editGridRow method)
recreateForm:true,
reloadAfterSubmit:false,
closeOnEscape:true,
savekey: [true,13],
closeAfterEdit:true,
ajaxEditOptions: {
beforeSend: function(jqXHR) {
// you should modify the next line to get the CSRF tocken
// in any way (for example $('meta[name=csrf]').attr('content')
// if you have <meta name="csrf" content="abcdefjklmnopqrstuvwxyz="/>)
var csrf_token = '<%= token_value %>'; // any way to get
jqXHR.setRequestHeader('X-CSRF-Token', csrf_token);
}
},
editData: {
csrfmiddlewaretoken: '<%= token_value %>'
}
},
{ // Add options (parameters of editGridRow method)
recreateForm:true,
reloadAfterSubmit:false,
closeOnEscape:true,
savekey: [true,13],
closeAfterAdd:true,
ajaxEditOptions: {
beforeSend: function(jqXHR) {
// you should modify the next line to get the CSRF tocken
// in any way (for example $('meta[name=csrf]').attr('content')
// if you have <meta name="csrf" content="abcdefjklmnopqrstuvwxyz="/>)
var csrf_token = '<%= token_value %>'; // any way to get
jqXHR.setRequestHeader('X-CSRF-Token', csrf_token);
}
},
editData: {
csrfmiddlewaretoken: '<%= token_value %>'
}
}
);
I placed here both ways: setting of 'X-CSRF-Token' HTTP header and posting of the csrfmiddlewaretoken parameter. You can remove one way after the corresponding experiments.
If you use some parameters for all grids on the page you can better change the defaults (see here for details)
jQuery.extend(jQuery.jgrid.edit, {
recreateForm:true,
reloadAfterSubmit:false,
closeOnEscape:true,
savekey: [true,13],
closeAfterAdd:true,
closeAfterEdit:true,
ajaxEditOptions: {
beforeSend: function(jqXHR) {
// you should modify the next line to get the CSRF tocken
// in any way (for example $('meta[name=csrf]').attr('content')
// if you have <meta name="csrf" content="abcdefjklmnopqrstuvwxyz="/>)
var csrf_token = '<%= token_value %>'; // any way to get
jqXHR.setRequestHeader('X-CSRF-Token', csrf_token);
}
},
editData: {
csrfmiddlewaretoken: '<%= token_value %>'
}
});
The setting is common for both Add and Edit forms. So you can use navGrid in the simplified form.
jQuery("#list").jqGrid('navGrid','#pager');
Check your cookies. Django's CSRF also save a cookie csrftoken which does have the same value as the csrf_token which you would use in a form. You can use any Javascript cookie library to get the cookie and pass it to the POST request as csrfmiddlewaretoken.
According to the jqGrid documentation, you can pass a postData options.
If you're using jQuery Cookie plugin, you can add something like :
postData: {
csrfmiddlewaretoken: $.cookie(CSRF_COOKIE_NAME)
},
to your list of options to jqGrid.
The CSRF_COOKIE_NAME is set in your django application settings.py and is 'csrftoken' by default.
I found simple solution using latest JqGrid and Inline Edit submit csrf_token to request POST django without #csrf_exempt
onSelectRow: function(id){
if(id && id!==lastSel){
$(selector).restoreRow(lastSel);
lastSel=id;
}
var editparameters = {
extraparam: {csrfmiddlewaretoken: $('.token-data').data('token')},
keys: true,
};
$(selector).jqGrid('editRow', id, editparameters);
}
For example, please see on my blog post:
http://yodi.polatic.me/jqgrid-inline-editing-integration-with-django-send-csrf-token/
I have a tree-grid with autoloading rows. The goal is to sort the grid by tree column, right on client side.
But each time I click on sort column header, it issues an Ajax call for sorting, but all I need is on-place sorting using the local data.
Do I have incorrect grid parameters or doesn't tree work with client-side sorting on tree column?
Current jqGrid params for sorting are are:
loadonce: true, // to enable sorting on client side
sortable: true //to enable sorting
To get client-side sorting to work, I needed to call reloadGrid after the grid was loaded:
loadComplete: function() {
jQuery("#myGridID").trigger("reloadGrid"); // Call to fix client-side sorting
}
I did not have to do this on another grid in my application because it was configured to use data retrieved via another AJAX call, instead of data retrieved directly by the grid:
editurl: "clientArray"
datatype: "local"
I'm using client-side sorting on jqGrid and retrieving a new set of json data when a select list changes. You need to set rowTotal to an amount higher or equal to the number of rows returned, and then set the data type to 'json' just before reloading the grid.
// Select list value changed
$('#alertType').change(function () {
var val = $('#alertType').val();
var newurl = '/Data/GetGridData/' + val;
$("#list").jqGrid().setGridParam({ url: newurl, datatype: 'json' }).trigger("reloadGrid");
});
// jqGrid setup
$(function () {
$("#list").jqGrid({
url: '/Data/GetGridData/-1',
datatype: 'json',
rowTotal: 2000,
autowidth: true,
height:'500px',
mtype: 'GET',
loadonce: true,
sortable:true,
...
viewrecords: true,
caption: 'Overview',
jsonReader : {
root: "rows",
total: "total",
repeatitems: false,
id: "0"
},
loadtext: "Loading data...",
});
});
$(function () {
$("#list").jqGrid({
url: '/Data/GetGridData/-1',
datatype: 'json',
rowTotal: 2000,
autowidth: true,
height:'500px',
mtype: 'GET',
loadonce: true,
sortable:true,
...
viewrecords: true,
caption: 'Overview',
jsonReader : {
root: "rows",
total: "total",
repeatitems: false,
id: "0"
},
loadtext: "Loading data...",
});
});