I'm having a problem with remote paging. It is not reading my reply properly and throwing a parse error. Here is my grid definition:
$("#igGrid").igGrid({ dataSource: "/SrvGrid?action=getList", columns: [ { headerText: "ID", key: "dataId", }, { headerText: "Data", key: "data", } ], features: [{ name: 'Paging', type: "remote", pageSize: 2, responseDataKey : "records", recordCountKey : "totalRecordCount", pageSizeUrlKey : 'pageSize', pageIndexUrlKey : 'pageIndex' } ] });
I am getting the proper reqest parms sent to my servlet :
http://localhost:8080/SrvGrid?action=getList&pageIndex=0&pageSize=2&_=1416188204654
My servlet queries the DB to create a list and then I build a Wrapper class around it (I don't know if this is correct or if theres an easier way) :
class Wrapper { public int totalRecordCount; public List<Data> records; }
The return JSon string looks like this :
{"totalRecordCount":5,"records":[{"dataId":1,"data":"AAA"},{"dataId":2,"data":"BBB"}]}
and it looks/parses fine in Firebug - an object with 2 elements, the 'totalRecordCount' and 'records', exactly as specified in the Paging feature of the grid. However, it returns this error:
Error: The remote request to fetch data has failed: (parsererror) There was an error parsing the JSON data and applying the defined data schema: The input data doesn't match the schema, the following field couldn't be mapped: dataId
I have no idea why this is not working. I thought the grid would stripoff the wrapper and and use just the 'records' property to populate the grid.
Strangely enough, if the servlet just passes back my data in the Json 'list' (WITHOUT the Wrapper), it is parsed correctly and the grid is loaded. So it seems to recognize that its remote paging when SENDING the request (by adding the paging parms) but it doesnt recognize that its using remote paging when RECEIVING the result - it doesnt know what to do with the 'totalRecordCount' and 'records' properties.
Can you help?
Thanks.
Hello C J,
Thank you for posting in our community.
When you're using Infragistics ASP.NET MVC wrapper it will handle remote paging automatically for you. You are required to create action method decorated with GridDataSourceActionAttribute attribute which returns ActionResult. In the action method just pass the data as instance of IQueryable. The GridDataSourceActionAttribute class (which implements IActionFilter interface) will transform the data according the request parameters and will return it as JsonResult.
Therefore, when remote paging is used, the grid automatically generates the proper request parameters in the following way:
http://<server>/grid/PagingGetData?page=2&pageSize=25
Some further reference about igGrid Paging could be found at:
http://help.infragistics.com/doc/jQuery/2014.2/CLR4.0/?page=igGrid_Paging.html
I made a small sample illustrating Remote Paging and I am attaching it for your reference. In my sample remote paging is used and DataSourceUrl property is set.
public JsonResult GetData(int pageSize, int page) { GridModel gridModel = GetGridModel(); // put your data in the data source // for example:gridModel.DataSource = GetList(pageSize, pageIndex).AsQueryable(); gridModel.DataSource = this.GetProducts(pageSize, page).AsQueryable(); return gridModel.GetData(); } /* * Dynamically construct the grid configuration * */ private GridModel GetGridModel() { GridModel gridModel = new GridModel(); gridModel.DataSourceUrl = Url.Action("GetData"); gridModel.AutoGenerateColumns = false; gridModel.Columns.Add(new GridColumn() { Key = "ProductID", HeaderText = "ProductID", DataType = "number" }); gridModel.Columns.Add(new GridColumn() { Key = "Name", HeaderText = "Name" }); gridModel.Columns.Add(new GridColumn() { Key = "ProductNumber", HeaderText = "ProductNumber" }); gridModel.Features.Add(new CustomGridPaging() { Type = OpType.Remote, PageSize = 5, CustomTotalRecordsCount = 200 }); return gridModel; }
public JsonResult GetData(int pageSize, int page)
{
GridModel gridModel = GetGridModel();
// put your data in the data source
// for example:gridModel.DataSource = GetList(pageSize, pageIndex).AsQueryable();
gridModel.DataSource = this.GetProducts(pageSize, page).AsQueryable();
return gridModel.GetData();
}
/*
* Dynamically construct the grid configuration
*
*/
private GridModel GetGridModel()
GridModel gridModel = new GridModel();
gridModel.DataSourceUrl = Url.Action("GetData");
gridModel.AutoGenerateColumns = false;
gridModel.Columns.Add(new GridColumn()
Key = "ProductID",
HeaderText = "ProductID",
DataType = "number"
});
Key = "Name",
HeaderText = "Name"
Key = "ProductNumber",
HeaderText = "ProductNumber"
gridModel.Features.Add(new CustomGridPaging()
Type = OpType.Remote,
PageSize = 5,
CustomTotalRecordsCount = 200
return gridModel;
Please let me know if you need any further assistance with this matter.
Hello, and thank you for your reply. However I have no idea what you sent me/attached. I didn't start this project (I just inherited it) so I don't even know if I'm using "ASP.NET MVC wrapper" and by the looks of your sample, I don't think I am. I'm not using visual basic, C# or anything Microsoft.
My pages are JSPs using struts2, and my server code is written in Java using Hibernate to query the database. Do you have a sample using these languages?
Thank you.
What I can suggest is try setting igGrid`s response data key property. This is basically the property in the responses where data records are held. Some further reference could be found at:
http://help.infragistics.com/jQuery/2014.2/ui.iggrid#options:responseDataKey
In your scenario this property could be set as following: responseDataKey: "records"
//Initialize $(".selector").igGrid({ responseDataKey : "records" });
//Initialize
$(
".selector"
).igGrid({
responseDataKey :
"records"
I hope you find this information helpful.
I'm not sure how my environment isn't supported. I am using jQuery 1.7.1 and jquery-ui.
CJ for your reference, try specifying the response data key on the igGrid level. Like so :
$("#igGrid").igGrid({ dataSource: "/SrvGrid?action=getList",
responseDataKey : "records", columns: [ { headerText: "ID", key: "dataId", }, { headerText: "Data", key: "data", } ], features: [{ name: 'Paging', type: "remote", pageSize: 2, responseDataKey : "records", recordCountKey : "totalRecordCount", pageSizeUrlKey : 'pageSize', pageIndexUrlKey : 'pageIndex' } ] });
Worked for me!
Hello Adil Sulaiman,
Thank you for sharing your experience with the community.
What I can suggest is have a separate thread for the issues that you are experiencing. This will ensure that your issue is going to be addressed correctly and we will provide you with better and more accurate support.
Please let me know if you have any additional questions.
I dont see the point of creating a separate thread when this one is addressing the same issue as mine. Anyway, i managed to solve it myself. If i run into any more issues, i shall open another thread.
Hello Adil,
I am glad that you have been able to resolve this issue.
Please feel free to contact us and create either a support request on our web site or a new forum thread in case that you have any questions.
Thank you for choosing Infragistics components.