<div>
<input type="text" id="pager" />
</div>
@(Html.EJ().Grid<object>("Grid")
.Datasource(datasource => datasource.Json((IEnumerable<object>)ViewBag.dataSource).Adaptor(AdaptorType.RemoteSaveAdaptor))
.AllowPaging()
.ClientSideEvents(events =>
{
events.Create("create")
})
.Columns(col =>
{
col.Field("OrderID").IsPrimaryKey(true).Add();
. . .
})
)
</div>
<script>
var pagerData = [
{ text: "10", value: 10 },
{ text: "20", value: 20 },
{ text: "30", value: 30 },
{ text: "40", value: 40 },
];
function create(args) {
var gridObj = $("#Grid").ejGrid("instance");
var pagerCookies = document.cookie.match("pageSize=");
if (!ej.isNullOrUndefined(pagerCookies)) {
var pageSize = parseInt(document.cookie.match("pageSize=").input.split("=")[1]);
gridObj.option({ "pageSettings": { pageSize: pageSize } }); //update pageSize on rendering
}
$('#pager').ejDropDownList({
change: "change",
value: this.model.pageSettings.pageSize,
dataSource: pagerData
});
}
function change(args) {
var gridObj = $("#Grid").ejGrid("instance");
gridObj.option({ "pageSettings": { pageSize: parseInt(args.text) } });
var pageSize = parseInt(args.text);
var pageSize = "pageSize" + "=" + pageSize;
document.cookie = pageSize; //save the pageSize in document.cookie
}
}
</script> |
@(Html.EJ().Grid<object>("Grid")
.Datasource(datasource => datasource.Json((IEnumerable<object>)ViewBag.dataSource).Adaptor(AdaptorType.RemoteSaveAdaptor))
.AllowPaging()
.PageSettings(p => {
p.PageSizeList(new List<int>() { 10, 25, 50, 100 });
p.PageSize(10);
})
.ClientSideEvents(events =>{
events.Create("create")
})
.Columns(col => {
col.Field("OrderID").IsPrimaryKey(true).Add();
. . .
})
)
<script type="text/javascript">
function create(args) {
var gridObj = $("#Grid").ejGrid("instance");
var pagerCookies = document.cookie.match("pageSize=");
if (!ej.isNullOrUndefined(pagerCookies)) {
var pageSize = parseInt(document.cookie.match("pageSize=").input.split("=")[1]);
gridObj.option({ "pageSettings": { pageSize: pageSize } });
}
this.element.find(".e-pager").ejPager({
pageSizeSelected: function (args) {
var gridObj = $("#Grid").ejGrid("instance");
gridObj.option({ "pageSettings": { pageSize: args.pageSize } });
var pageSize = args.pageSize;
var pageSize = "pageSize" + "=" + pageSize;
document.cookie = pageSize;
}
});
}
</script> |