Grid format not working for calculated column

[Scott Lambert]

I have a calculated column in a grid, wont format, the calculated value works fine but the format is not applied:

HowMuch is the column value used and total is the sum of the column

My razor statement is:

<e-grid-column field="Percent" format="P2" template="<span>${HowMuch / @(total)}</span>" width="10"></e-grid-column>

Thanks

Scott

[Thavasianand Sankaranarayanan]

Hi Scott, 

Greetings from Syncfusion. 

We can achieve your requirement using the numberFormat method in base. In the below code example we have do percentage format for the “EmployeeID” column which has the template. 

<ejs-grid id="Grid" dataSource="ViewBag.dataSource" allowPaging="true"  > 

    <e-grid-editSettings allowAdding="true" allowDeleting="true" allowEditing="true"></e-grid-editSettings> 

    <e-grid-columns> 

        <e-grid-column field="OrderID" headerText="Order ID" isPrimaryKey="true" textAlign="Right" width="100"></e-grid-column> 

        <e-grid-column field="CustomerID" headerText="Customer ID" width="100"></e-grid-column> 

        <e-grid-column field="EmployeeID" headerText="Employee ID" template="#coltemplate" width="100"></e-grid-column> 

        <e-grid-column field="Freight" width="100" ></e-grid-column> 

        <e-grid-column field="Verified" headerText="Verified" width="100"></e-grid-column> 

        

    </e-grid-columns> 

</ejs-grid> 

 

<script id="coltemplate" type="text/template" > 

 

    <span>${format(data)}</span>  // we pass row data to the format function 

 

</script>   

   

<script> 

    var format = function (value) { 

        var intl = new ej.base.Internationalization(); 

        var emp = 100; 

        var formattedValue = intl.formatNumber(value.EmployeeID/emp, { 

            format: 'P2' }); // Format teh template value and also we made the calculation in here 

        return formattedValue; 

    } 

</script> 

Refer the help documentation. 

Link: https://ej2.syncfusion.com/aspnetcore/documentation/common/internationalization/?no-cache=1#code-classlanguage-textformatnumbercode 

Regards, 

Thavasianand S.