Hi Michael,
Greetings from Syncfusion support.
From your query we understood that you want to show the number for each row in Grid. If so you can achieve your requirement by using the column template. Please refer to the below code example, documentation link and sample link for more information.
In the below sample we have added the row index as row header in each row.
[index.cshtml]
|
<template>
<div id="app">
<ejs-grid
id="Grid"
ref="grid"
:rowDataBound="rowDataBound"
:dataSource="data"
:allowPaging="true"
>
<e-columns>
// if you have the rowheader value in dataSource then you can set by adding <span>${fieldName}</span>
<e-column width="80" headerText="S.NO" template="<span></span"></e-column>
<e-column field="OrderID" headerText="Order ID" width="90"></e-column>
<e-column field="Freight" headerText="Freight" format="C2" width="90"></e-column>
</e-columns>
</ejs-grid>
</div>
</template>
<script>
. . .
methods: {
rowDataBound: function(e) {
var data = this.$refs.grid.ej2Instances.getRowObjectFromUID(
e.row.getAttribute("data-uid"); // getting the row details
);
e.row.getElementsByTagName("span")[0].innerText = data.index;
}
}
};
</script>
|
Please get back to us if you need any further assistance on this.
Regards,
Pavithra S.
