Hi Xia
Thanks for contacting Syncfusion Support.
Query: Does have any way to display the rowIndex to continually to the next page without changing my grid datasource?
Using templateRefresh event we can achieve your requirement, In the templateRefresh event of the Grid, we have calculated the Index value based on pageSize and currentPage of the records along with rowIndex. This event will re-render automatically, when any grid action is performed. So while moving to the next page it will update the rowIndex based on pageSize and currentPage of pageSettings property.
Please refer to the code example:-
|
<script type="text/x-jsrender" id="columnTemplate">
<span class="label label-warning></span>
</script>
<div id="Grid"></div>
<script type="text/javascript">
$(function () {
// the datasource "window.gridData" is referred from jsondata.min.js
var data = ej.DataManager(window.gridData).executeLocal(ej.Query().take(50));
$("#Grid").ejGrid({
dataSource: data,
allowPaging: true,
allowSorting: true,
isResponsive: true,
columns: [
{ headerText: "RowIndex", template: true, templateID: "#columnTemplate", textAlign: "center", width: 110 },
. . .
],
templateRefresh:"refresh",
});
});
function refresh(args) {
Index = (this.model.pageSettings.pageSize * (this.model.pageSettings.currentPage-1)) + args.rowIndex + 1;
$(args.cell).find("span").text(Index);
}
</script> |
Please refer to the sample and documentation link:-
Regards,
Manivannan Padmanaban.
