Hi Sergio,
Thank you for your interest in Syncfusion products.
It is possible to implement client-side paging through the client-side API available in the Syncfusion MVC Grid. We have prepared a sample to demonstrate implementing client-side paging using Json mode and the same can be downloaded from the following link.
CustomBinding1980112721.zip[Please choose the appropriate configuration setting (Debug MVC3/Release MVC3) if you want to run the sample with ASP.NET MVC 3]
Here are some relevant code snippets from the sample along with some explanation
1) Retrieving all the records in the OnLoad event
[JavaScript]
function GetTotalRecords(sender, args) {
$.ajax({
type: "POST",
url: "CustomBinding/GetRecords", // Get the data from the Json records
dataType: "json",
success: function (data) {
totalRecords = data;
}
});
gridObj = $find("OrdersGrid");
gridObj._RevertAction = function () { };
}
[Controller]
public ActionResult GetRecords()
{
var data = new NorthwindDataContext().OrdersViews.ToList();
return Json(data); // returns the data to the Onload event
}
[Aspx]
<%=Html.Syncfusion().Grid
("OrdersGrid")
.ActionMode(ActionMode.JSON)
.Column(column => {
…..
column.Add(p => p.OrderID).HeaderText("Order ID");
})
.ClientSideEvents(eve=>{
eve.OnActionBegin("ClientSidePaging"); //used for client-side functions
eve.OnLoad("GetTotalRecords"); // used to get total records
})
%>
2) client-side paging
We have implemented client-side paging through linq-Jquery . Skip and Take methods are used to page the data's.
function ClientSidePaging(sender, args) {
if (args.requestType == "paging") { //// here we are checking the condition for paging to cancel the default paging.
var json = Sys.Serialization.JavaScriptSerializer.deserialize(args.data.ClientObject);
args.cancel = true;
processedData = $.Enumerable.From(totalRecords).ToArray();
if (json.AllowPaging == true) {
processedData = $.Enumerable.From(processedData).Skip(args.data.StartIndex).Take(args.data.PageSize).ToArray();
}
var griddata = { TotalRecordsCount: totalRecords.length };
gridObj.jsonModeMgr.set_dataSource(processedData);
gridObj._CommonSuccessAction(griddata);
gridObj._reLoadEssentialsAtGridReferesh(gridObj, args.requestType); //these methods are used to refresh the grid after paging and sorting
}
}
Please let us know if you would require any further assistance.
Regards,
Eswari.S