Format numeric column

[Panora]

Hi,

I have a list of products attached to the grid. The Weight column is of type "double" in the model. I need to format the Weight column with 2 decimal places. Please look at the examples below:

1 should be 1.00

3.5 should be 3.50

5.85 should be 5.85

I tried to use the format attribute in the html like format="{0:N2}" but it didn't work.

Any help would be appreciated.

Thanks,

Leo

[Unknown]

Try this:    format="N2"

[Hariharan J V]

Hi Panora,  

Thanks for contacting Syncfusion support. 

@Jacob Thanks your suggestion. 

As per @Jacob suggestion, we need to set `N2` on the column format property. In the Essential JS2 components, we have used Internalization library(cldr data) for formatting, Please refer the below documentation links. 

 

Documentation: https://ej2.syncfusion.com/aspnetcore/documentation/common/intl.html#manipulating-numbers  

 https://ej2.syncfusion.com/aspnetcore/documentation/grid/columns.html#format  

 

Please let us know if you have any concerns. 

 

Regards,  

Hariharan  

[Unknown]

Thanks Hariharan,

Formatting appears to work fine for columns, but I've found that it does not work on aggregate columns.  Can you add aggregate columns to your grid and try it out?  I have a float that I'm trying for format N2.

[Panora]

Unfortunately N2 doesn't work. Is this because the field in the model is nullable double?

[Panora]

What worked for me was to specify the type of the column using the "type" attribute.

<e-grid-column field="Rating" headerText="Rating" width="100" textAlign="Center" type="number" format="N2"></e-grid-column>

According to the documentation, if the type is not specified, it will use the first row in the grid to determine the type of the column. In my case the value for the field in the first row was null (since in my model I used nullable double), so I guess the field was translating to string type and N2 by itself didn't work. As soon as I added the type attribute, started working as expected.

Thank you for all the help.

[Hariharan J V]

Hi Jacob, 

 

Based on your request we have created a sample ‘Aggregate column with N2 format’. Please find the code example and sample for your reference. 

 

 

Code example 

 

 

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

        <e-grid-aggregates> 

            <e-grid-aggregate> 

                <e-aggregate-columns> 

                    <e-aggregate-column field="Freight" format="N2" type="Sum" footerTemplate="Sum:${Sum}"></e-aggregate-column> 

                </e-aggregate-columns> 

            </e-grid-aggregate> 

            <e-grid-aggregate> 

                <e-aggregate-columns> 

                    <e-aggregate-column field="Freight" format="N2" type="Average" footerTemplate="Average:${Average}"></e-aggregate-column> 

                </e-aggregate-columns> 

            </e-grid-aggregate> 

        </e-grid-aggregates> 

        <e-grid-pagesettings pageCount="5"></e-grid-pagesettings> 

        <e-grid-columns> 

             . . . 

            <e-grid-column field="ShipCountry" headerText="Ship Country" width="140"></e-grid-column> 

        </e-grid-columns> 

    </ejs-grid> 

 

 

Sample: http://www.syncfusion.com/downloads/support/directtrac/general/ze/WebApplication441614944556.zip  

 

 

 

Regards, 

Hariharan 

[Hariharan J V]

Hi Leonid,  

  

Thanks for the feedback.  

 

We are very happy to hear that your issue is resolved. Please let us know if you have any further assistance on this.  

   

Regards,  

Hariharan 

[Unknown]

I cannot reproduce the problem on your example, but I think a difference may be that I'm using a URLAdaptor.  Sometimes the formatting on aggregate columns works, and sometimes it doesn't.  Forcing the grid to repaint by sorting a column will make the formatting work, and sometimes a re-sort makes the formatting disappear again.

[Mohammed Farook J]

Hi Jacob, 

We have created a sample “Url Adaptor with sorting and aggregate(with formats) ” and you can download from the following link 

Sample : http://www.syncfusion.com/downloads/support/forum/139094/ze/WebApplication44583752392   

Still if you have faced any issue , please share the Essential JS2 version and the Grid code example or sample if it is possible . it helps to find the solution at earlier 

Regards, 

J Mohammed Farook