I'm using strongly typed helper for jqGrid - Lib.Web.Mvc
I can't force jqGrid to sort my data. When I click on arrow in the header, I get the following error in Firebug:
uncaught exception: jqGrid - No such method: resetSelection
also when I click on cell in the row I get:
uncaught exception: jqGrid - No such method: setSelection
This is my js code:
#{
var grid = new Lib.Web.Mvc.JQuery.JqGrid.JqGridHelper<ViolationViewModel>("products",
dataType: Lib.Web.Mvc.JQuery.JqGrid.JqGridDataTypes.Json,
methodType: Lib.Web.Mvc.JQuery.JqGrid.JqGridMethodTypes.Post,
pager: true,
rowsNumber: 5,
sortingName: "Id",
sortingOrder: Lib.Web.Mvc.JQuery.JqGrid.JqGridSortingOrders.Asc,
url: Url.Action("Violation", "Cabinet"),
viewRecords: true,
rowsList: new List<int>() { 5, 10, 20, 30, 50, 100 },
autoWidth: true,
loadOnce: true,
rowsNumbers: true
);
}
I'm using loadOnce option.
This code in action:
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Violation(JqGridRequest request)
{
JqGridResponse response = new JqGridResponse()
{
TotalRecordsCount = 7
};
response.Records.Add(new JqGridRecord<ViolationViewModel>("1", new ViolationViewModel
{
Id = 1,
Name = "Test1"
}));
response.Records.Add(new JqGridRecord<ViolationViewModel>("2", new ViolationViewModel
{
Id = 2,
Name = "Test2"
}));
response.Records.Add(new JqGridRecord<ViolationViewModel>("3", new ViolationViewModel
{
Id = 3,
Name = "Test3"
}));
response.Records.Add(new JqGridRecord<ViolationViewModel>("4", new ViolationViewModel
{
Id = 4,
Name = "Test4"
}));
response.Records.Add(new JqGridRecord<ViolationViewModel>("5", new ViolationViewModel
{
Id = 5,
Name = "Test5"
}));
response.Records.Add(new JqGridRecord<ViolationViewModel>("6", new ViolationViewModel
{
Id = 6,
Name = "Test6"
}));
response.Records.Add(new JqGridRecord<ViolationViewModel>("7", new ViolationViewModel
{
Id = 7,
Name = "Test7"
}));
return new JqGridJsonResult() { Data = response };
}
Related
I want to load items by page since I have tables with large amount of data, but I don't want to load items for each page once the user clicks it.
Instead, I rather preload 1000 items (for example) ahead and only fetch more results if the user moves to a page I still didn't fetch the data for.
Is it possible?
I found a way to solve it.
Here is the basic logic:
Create a local data cache object that will hold arrays of results for each page.
When fetching data from the server, always return data for a few pages ahead and store them in the local cache object
Write a method for the controller.loadData that will check to see if you have the desired page results in the local cache object, if so - return that array, if not - return a promise that will fetch the results with some extra data for a few pages ahead.
An example of the local cache object snapshot:
{
"1": [{name: "ff"}, {name: "fdd"}],
"2": [{name: "fds"}, {name: "dsr"}],
"3": [{name: "drr"}, {name: "ssr"}]
}
script section
<script type="text/javascript">
$(document).ready(function () {
List();
});
function List() {
//$(function () {
loadjsgrid();
$("#jsGrid").jsGrid({
height: "auto",
width: "100%",
filtering: true,
editing: false,
sorting: true,
autoload: true,
paging: true,
pageSize: 10,
pageButtonCount: 5,
pageLoading: true,
controller: {
loadData: function (filter) {
var startIndex = (filter.pageIndex - 1) * filter.pageSize;
var d = $.Deferred();
$.ajax({
type: 'GET',
url: '#Url.Action("[ActionName]", "[Controllername]")',
data: filter,
contentType: 'application/json; charset=utf-8',
dataType: 'json',
success: function (data) {
if (data.Message == "Failed") {
data.Result = [];
data.Count = 0;
}
console.log(data);
d.resolve(data);
}
});
return d.promise().then(function (q) {
return {
data: q.Result,
itemsCount: q.Count
}
});
}
},
},
fields: [
{ name: "rct_no", type: "text", title: 'Serial Number', autosearch: true, width: '10%' }
],
});
$("#pager").on("change", function () {
var page = parseInt($(this).val(), 10);
$("#jsGrid").jsGrid("openPage", page);
});
}
Controller section
public ActionResult getList(int pageIndex = 1, int pageSize = 10)
{
try
{
var query = #" from rd_receipt_header
var irList = DAL.db.Fetch<[className]>(pageIndex, pageSize, #"select * " + query );
var count = DAL.db.ExecuteScalar<int>("select count(*) " + query);
return Json(new { Message = "Success", Result = irList, Count = count }, JsonRequestBehavior.AllowGet);
}
catch (Exception ex) { return Json(new { Message = "Failed", Result = ex.Message }, JsonRequestBehavior.AllowGet); }
I am using ajax to get data from server as ajax format
I want to create dynamic Jqgrid at runtime. I have made tow methods as
public ActionResult getdata( List<UserModel> lst)
{
UserModel usermodel = new UserModel();
UserService uservice = new UserService();
//return View(db.VideoModels.OrderByDescending(v => v.VideoId).ToPagedList(page, 3));
string[] columnNames = (string[])TempData["columnname"];
lst = new List<UserModel>();
lst = uservice.GetAllUsers();
JavaScriptSerializer serializer = new JavaScriptSerializer();
List<Dictionary<string, object>> rows = new List<Dictionary<string, object>>();
Dictionary<string, object> row;
foreach (var dr in lst)
{
row = new Dictionary<string, object>();
rows.Add(row);
}
return Json(serializer.Serialize(lst), JsonRequestBehavior.AllowGet);
}
public ActionResult GetColumnDetails( List<UserModel> lst)
{
UserModel usermodel = new UserModel();
UserService uservice = new UserService();
lst = new List<UserModel>();
lst = uservice.GetAllUsers();
var listOfStrings = new List<string>();
string[] colNames = listOfStrings.ToArray();
string[] columnNames = (from t in typeof(PrTblUsers).GetProperties() select t.Name).ToArray();
JavaScriptSerializer serializer = new JavaScriptSerializer();
return Json(serializer.Serialize(colNames= columnNames), JsonRequestBehavior.AllowGet);
}
getcolumdetail is for getting column name and get data is for getting data.
div class="row">
<div id="content" style="margin-left:15px !important;">
<table id="datacopyProject"></table>
<div id="datacopy_pagerProject"></div>
#*<table id="datacopyfilter"></table>
<div id="datacopy_pagerfilter"></div>*#
</div>
</div>
<script type="text/javascript" id="getdata">
$(document).ready(function () {
var item = [];
//creating the dyanamic colmodel
$("#datacopyProject").jqGrid('GridUnload');
$.ajax(
{
type: "POST",
url: '/Test/GetColumnDetails',
//data: { tid: data },
dataType: "json",
success: function (result) {
var colModels = BuildColumnModel(JSON.parse(result));
//console.log(JSON.stringify(result));
//var obj = jQuery.parseJSON(result);
//var columnData = result.mypage,
item= getData();
//alert(item);
jQuery("#datacopyProject").jqGrid({
colNames: item,
colModel: colModels,
autowidth:true,
caption: "User List",
pager: jQuery('#datacopy_pagerProject'),
rowNum: 3,
viewrecords: true,
rowList: [5, 10, 20, 50],
viewrecords: true,
jsonReader: {
repeatitems: false,
root: function (obj) { return obj; },
page: function (obj) { return $("#datacopyProject").jqGrid('getGridParam', 'page'); },
total: function (obj) { return Math.ceil(obj.length / $("#datacopyProject").jqGrid('getGridParam', 'rowNum')); },
records: function (obj) { return obj.length; }
},
gridComplete: function () {
},
loadComplete: function (data) { }
})
},
loadonce:true,
error: function (x, e) {
alert(x.readyState + " " + x.status + " " + e.msg);
}
});
//setTimeout(function () { $("#datacopyProject").jqGrid('setGridParam', { datatype: 'json' }); }, 500);
//binding the data to dyanamic colmodel
function getData()
{
$.ajax({
url: '/Test/getdata',
type: "POST",
datatype: "json",
//data: { userid: data },
async: false,
success: function (response) {
var resultData = JSON.parse(response);
//var data = resultData.slice(1, resultData.length - 1);
//var json = JSON.stringify(data);
//console.log(resultData);
////var resultData = JSON.parse(response);
for (var i = 0; i <= resultData.length; i++)
item = $("#datacopyProject").jqGrid('addRowData', i + 1, datacopyProject[i]);
//$(resultData).each(function (e) {
// $("#datacopyProject").addRowData(e, this);
//});
}
});
}
});
function BuildColumnModel(result) {
debugger;
// var uFields = result.split(',');
var uFields = result;
var columns = [];
for (var i = 0; i < uFields.length ; i++) {
if (uFields[i].indexOf('Id') > -1) {
columns.push({ name: uFields[i], index: uFields[i], key: true });
//columns.push({ 'name': name, 'index': name, key: true});
}
// else if (uFields[i].indexOf('Name') > -1) {
else if (uFields[i].length > -1) {
columns.push({ name: uFields[i], index: uFields[i] })
// columns.push({ 'name': name, 'index': name });
}
//else if (uFields[i].length > -1) {
// columns.push({ name: uFields[i], index: uFields[i]})
// //columns.push({ 'name': name, 'index': name, key: true });
//}
}
return columns;
}
I am getting the column value in jQgrid but not getting the rows.
You can use the solution explained in this post, and return from the controller a ViewBag with these variables joined:
var jsonGrid = jQuery.parseJSON('#Html.Raw(ViewBag.YourGridVariableInJson)');
Is it possible to return a variable, more specifically an array of values or a string from an $.ajax call. I currently understand that this can't be done... i.e. $.ajax responses need to be added to the DOM immediately. Please correct me if I am missing something obvious here.
var infoWindow;
var tableID = 'atableID';
var str;
var beachID;
var beach_location;
var beach_region;
/* start map initialization */
function initialize() {
latlng = new google.maps.LatLng(49.894634, -97.119141);
var myOptions = {
center: latlng,
zoom: 7,
mapTypeId: google.maps.MapTypeId.ROADMAP,
zoomControlOptions: {
style: google.maps.ZoomControlStyle.SMALL
},
mapTypeControl: true,
mapTypeControlOptions: {
mapTypeIds: [
google.maps.MapTypeId.ROADMAP,
google.maps.MapTypeId.SATELLITE,
google.maps.MapTypeId.HYBRID,
google.maps.MapTypeId.TERRAIN
],
style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
},
overviewMapControl: true,
overviewMapControlOptions: {
opened: true
}
};
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
layer = new google.maps.FusionTablesLayer({
query: {
select: 'Point',
from: atableID
},
suppressInfoWindows: true
});
layer.setMap(map);
infoWindow = new google.maps.InfoWindow();
google.maps.event.addListener(layer, 'click', function (e) {
// close infoWindow if open
if (infoWindow) {
infoWindow.close();
}
beachID = e.row['Beach_ID'].value;
beach_location = e.row['Beach_Location'].value; ;
beach_region = e.row['Beach_Region'].value;;
//console.log(beachID);
// get data set
getEcoliData(beachID,beach_location,beach_region);
getAlgaeData(beachID,beach_location,beach_region);
}); // end google.maps.addListener
} // end map initialization
function getEcoliData(beachID,beach_location,beach_region) {
//local namespace
var rows = [];
var ecoliTable;
var items = [];
var queryURL = "https://www.googleapis.com/fusiontables/v1/query?sql=";
var queryTail = '&key=a key value=?';
var whereClause = "WHERE 'Beach_ID' = " + beachID;
var query = "SELECT 'Sample_Date', 'Average_E._coli_Density','Recreational_Water_Quality_Guideline' FROM atblid " + whereClause + " ORDER BY 'Sample_Date' DESC";
var queryText = encodeURI(query);
$.ajax({
type: "GET",
url: queryURL + queryText + queryTail,
cache: false,
dataType: 'jsonp',
success: function (data) {
rows = data.rows;
// empty table
//$('#content_placeholder').empty();
//$('.ecoli_table').remove();
$('#ecoli_heading').empty();
$('#content_placeholder').prepend('<h6 id="ecoli_heading">E.Coli Data</h6>')
.append('<p>' + beach_location + '</p>').append('<p>' + beach_region + '</p>');
$('.ecoli_table').append('<tr>'
+ '<th>Sample Date</th>'
+ '<th>Average E.Coli Density</th>'
+ '<th>Recreational Water Quality Guideline</th>'
+ '</tr>');
for (var i = 0; i < rows.length; i++) {
//items.push(rows[i]);
$('.ecoli_table tr:first').after('<tr><td>' + rows[i].join('</td><td>') + '</td></tr>');
}
if (typeof ecoliTable == 'undefined') {
// dataTables
ecoliTable = $(".ecoli_table").dataTable({
"sPaginationType": "full_numbers",
"aLengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],
"aaSorting": [[0, "desc"]],
"bDestroy": true,
"aoColumns": [
{ "sTitle": "Sample_Date" },
{ "sTitle": "Average_E._coli_Density" },
{ "sTitle": "Recreational_Water_Quality_Guideline" }
]
});
} else {
//ecoliTable.fnDestroy();
$(".ecoli_table > tbody").empty();
ecoliTable.fnDraw();
//$('.ecoli_table').find("tr:gt(0)").remove();
}
},
error: function () {
alert("Data is not available for this location at the present time, please check back at a later time. Thank you.");
}
});
}
function getAlgaeData(beachID,beach_location,beach,region) {
//local namespace
var rows = [];
var algaeTable;
var items = [];
var queryURL = "https://www.googleapis.com/fusiontables/v1/query?sql=";
var queryTail = '&key=apikey&callback=?';
var whereClause = "WHERE 'Beach_ID' = " + beachID;
var query = "SELECT 'Sample_Date','Algal_Toxin_Microcystin','Recreational_Guideline_20','Blue_Green_Algae_Cells','Recreational_Guideline' FROM tableid " + whereClause + " ORDER BY 'Sample_Date' DESC";
var queryText = encodeURI(query);
$.ajax({
type: "GET",
url: queryURL + queryText + queryTail,
cache: false,
dataType: 'jsonp',
success: function (data) {
rows = data.rows;
// empty table
//$('#content_placeholder').empty();
//$('.algae_table').remove();
$('#algae_heading').empty();
$('.ecoli_table').after('<h6 id="algae_heading">Algae Data</h6>');
$('.algae_table').append('<tr>'
+ '<th>Sample Date</th>'
+ '<th>Algal_Toxin_Microcystin</th>'
+ '<th>Recreational_Guideline_20</th>'
+ '<th>Blue_Green_Algae_Cells</th>'
+ '<th>Recreational_Guideline</th>'
+ '</tr>');
for (var i = 0; i < rows.length; i++) {
//items.push(rows[i]);
$('.algae_table tr:first').after('<tr><td>' + rows[i].join('</td><td>') + '</td></tr>');
}
if (typeof algaeTable == 'undefined') {
//algae
algaeTable = $(".algae_table").dataTable({
"sPaginationType": "full_numbers",
"aLengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],
"bDestroy": true,
"aaSorting": [[0, "desc"]],
"aoColumns": [
{ "sTitle": "Sample_Date" },
{ "sTitle": "Algal_Toxin_Microcystin" },
{ "sTitle": "Recreational_Guideline_20" },
{ "sTitle": "Blue_Green_Algae_Cells" },
{ "sTitle": "Recreational_Guideline" }
]
});
} else {
//algaeTable.fnDestroy();
$(".algae_table > tbody").empty();
algaeTable.fnDraw();
//$('.algae_table').find("tr:gt(0)").remove();
}
},
error: function () {
alert("Data is not available for this location at the present time, please check back at a later time. Thank you.");
}
});
}
I am trying to query 2 different Google Fusion tables and return each table under a new tab within a google infoWindow. However, I am running into issues because I can't seem to return an array or string from the $.ajax function to the parent scope. For example, the items array above returns undefined. Any thoughts around this is greatly appreciated.
Thanks in advance,
Michael
It is definitely possible. You haven't provided enough code to determine what's wrong, e.g. queryURL, queryText, etc. You'll need your Google API key as well. Here is an example demonstrating how to do it.
https://developers.google.com/fusiontables/docs/samples/basic_jsonp_request
Hi all i have storedprocedure which where i get the output data like this
var loggedbugs
projectName ProjectYear ProjectMonth Week1 Week2 Week3 Week4 Week5
Ecommerce 2012 8 0 1 4 3 0
var loggedbugs
projectName ProjectYear ProjectMonth Week1 Week2 Week3 Week4 Week5
Ecommerce 2012 8 2 2 8 3 0
and i call this storedprocedure in my MVC application and return this data as Json like this
public ActionResult Index()
{
return View();
}
public JsonResult CreatedBugs()
{
int year;
int month;
int projectid;
year = 2012;
month = 8;
projectid = 16;
var loggedbugs = db.ExecuteStoreQuery<LoggedBugs>("LoggedBugs #Year,#Month,#ProjectID", new SqlParameter("#Year", year), new SqlParameter("#Month", month), new SqlParameter("#ProjectID", projectid)).ToList();
var ClosedBugs = db.ExecuteStoreQuery<LoggedBugs>("ClosedBugs #Year,#Month,#ProjectID", new SqlParameter("#Year", year), new SqlParameter("#Month", month), new SqlParameter("#ProjectID", projectid)).ToList();
var model = new LoggedBugs
{
LoggedBugsCount = loggedbugs,
ClosedBugs = ClosedBugs
};
return Json(model, JsonRequestBehavior.AllowGet);
}
model return me record count two here...so now what i want to do is ...this data should be binded to linechart where LoggedBugsCount should have a different line and ClosedBugs should have a different line...
and weeks should be on Xaxis and y axis should have the count....
can any one help me here in how to bind this data line chart in highcharts..this is what i am trying for now but there is no result
<script type="text/javascript">
$(document).ready(function () {
alert(1);
$.getJSON('<%= Url.Action("CreatedBugs","WeeklyLoggedBugs") %>', {}, function (data) {
var json = data;
alert(data);
var loggedbugs = [];
var closedbugs = [];
for (var i in json) {
// var serie = new Array(json[i].Projects, json[i].Bugs);
//jsondata.push([json[i].projectName, json[i].ProjectYear, json[i].ProjectMonth, json[i].Week1, json[i].Week2, json[i].Week3, json[i].Week4, json[i].Week5]);
loggedbugs.push([json[i].LoggedBugsCount]);
closedbugs.push([json[i].ClosedBugs]);
}
chart.series[0].data = loggedbugs;
chart.series[1].data = closedbugs;
var chart;
chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
type: 'line'
},
title: {
text: 'Daily Reports'
},
subtitle: {
text: 'Logged Bugs'
},
xAxis: {
categories: ['Week1', 'Week2', 'Week3', 'Week4', 'Week5']
},
yAxis: {
title: {
text: 'Temperature (°C)'
}
},
tooltip: {
enabled: false,
formatter: function () {
return '<b>' + this.series.name + '</b><br/>' +
this.x + ': ' + this.y + '°C';
}
},
plotOptions: {
line: {
dataLabels: {
enabled: true
},
enableMouseTracking: false
}
},
series: [{
type: 'line',
name: 'Logged Bugs'
},
{
type: 'line',
name: 'ClosedBugs'
}]
});
});
});
</script>
See here
chart.series[0].data = loggedbugs;
chart.series[1].data = closedbugs;
var chart;
chart = new Highcharts.Chart({
........
});
First, You are adding data to series before creating Chart and even defining chart variable.
Second, You can set data in series using:
series: [{
name: 'Logged Bugs',
data: loggedbugs
},
{
name: 'ClosedBugs',
data: closedbugs
}]
So, You event don't need
chart.series[0].data = loggedbugs;
chart.series[1].data = closedbugs;
Here is the example: http://jsfiddle.net/mhardik/JRq7Z/
EDIT:
I dont know asp.net MVC3
Check whether you are getting data. Print response in console using console.log() if you are using FF.
for (var i in json) {
loggedbugs.push([json[i].LoggedBugsCount]);
closedbugs.push([json[i].ClosedBugs]);
}
// Check
console.log(loggedbugs); console.log(closedbugs);
jQuery.extend(
jQuery.jgrid.edit, {
ajaxEditOptions: { contentType: "application/json" }, //form editor
reloadAfterSubmit: true
// afterSubmit: function (response, postdata) {
// return [true, "", $.parseJSON(response.responseText).d];
//}
});
$.extend($.jgrid.defaults, {
datatype: 'json',
ajaxGridOptions: { contentType: "application/json" },
ajaxRowOptions: { contentType: "application/json", type: "POST" },
//row inline editing
serializeGridData: function(postData) { return JSON.stringify(postData); },
jsonReader: {
repeatitems: false,
id: "0",
cell: "",
root: function(obj) { return obj.d.rows; },
page: function(obj) { return obj.d.page; },
total: function(obj) { return obj.d.total; },
records: function(obj) { return obj.d.records; }
}
});
$("#grantlist").jqGrid({
url: 'webservice.asmx/GetGrant',
colNames: ['ID', 'Name', 'Title'],
colModel: [
{ name: 'ID', width: 60, sortable: false },
{ name: 'name', width: 210, editable: true },
{ name: 'title', width: 210, editable: true }
],
serializeRowData: function(data) {
var params = new Object();
params.ID = 0;
params.name = data.name;
params.title = data.title;
return JSON.stringify({ 'passformvalue': params, 'oper': data.oper, 'id': data.id });
},
mtype: "POST",
sortname: 'ID',
rowNum: 4,
height: 80,
pager: '#pager',
editurl: "webservice.asmx/ModifyGrant"
});
$("#grantlist").jqGrid('navGrid', '#pager', { add: false, edit: false, del: false, refresh: false, search: false });
$("#grantlist").jqGrid('inlineNav', '#pager');
//this is my server code
[WebMethod(EnableSession = true)]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public JQGrid<GrantComittee> GetGrantComittee(int? page, int? rows, string sidx, string sord, bool _search)
{
JQGrid<GrantComittee> jqgrid = new JQGrid<GrantComittee>();
List<GrantComittee> data = GetGComittee();
jqgrid.records = data.Count; //total row count
jqgrid.total = (int)Math.Ceiling((double)data.Count / (double)rows); //number of pages
jqgrid.page = page.Value;
//paging
data = data.Skip(page.Value * rows.Value - rows.Value).Take(rows.Value).ToList();
foreach(GrantComittee i in data)
jqgrid.rows.Add(i);
return jqgrid;
}
[WebMethod(EnableSession = true), ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public int ModifyGrantComittee(GrantComittee passformvalue, string oper, string id)
{
if (String.Compare(id, "_empty", StringComparison.Ordinal) == 0 ||
String.Compare(oper, "add", StringComparison.Ordinal) == 0)
{
GrantComittee data = new GrantComittee();
List<GrantComittee> set = new List<GrantComittee>();
set = (List<GrantComittee>)Session["grantcomittee"];
data = passformvalue;
data.ID = set.Max(p => p.ID) + 1;
set.Add(data);
Session["grantcomittee"] = set;
return data.ID;
}
else if (String.Compare(oper, "edit", StringComparison.Ordinal) == 0)
{
// TODO: modify the data identified by the id
return 0;
}
else if (String.Compare(oper, "del", StringComparison.Ordinal) == 0)
{
// TODO: delete the data identified by the id
return 0;
}
return 0;
}
I am using JqGrid to retrieve and add new records to database. So far i have been able to retrieve and add new items to the DB, I am using "json". I do get in the response {"d": "5"} for the id of the newly created row in the DB. However the new id does not display in the grid.
How can I update that value to new added row?
In the most cases you don't need to do anything because of default setting reloadAfterSubmit: true. It means that the full grid will be reloaded from the server after the user add new row or modify an existing one.
If you want use reloadAfterSubmit: false setting and the server returns the id of the new created row in the response you need implement afterSubmit callback function which will decode the server response and return it for the usage of by jqGrid. The corresponding code could be about the following:
afterSubmit: function (response, postdata) {
return [true, "", $.parseJSON(response.responseText).d];
}
You can define the callback by overwriting the default parameters $.jgrid.edit (see here and here).
I am using 'inlinNav' and after adding a new row i was not getting the grid to reload. The solution I found was to add parametes to the 'inlineNav' declaration. So I end up with the code i am providing as reference:
$("#grantlist").jqGrid('inlineNav', '#pager', { addParams: { position: "last", addRowParams: {
"keys": true, "aftersavefunc": function() { var grid = $("#grantlist"); reloadgrid(grid); }
}
}, editParams: { "aftersavefunc": function() { var grid = $("#grantlist"); reloadgrid(grid); } }
});
function reloadgrid(grid) {
grid.trigger("reloadGrid");
}
I was using more than one grid that is why i pass a grid parameter to the reload function.