We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
close icon

Setting the currency format

Hi there!

How can i change the currency format in grid cells?


Thank you!
Guilherme


3 Replies

TS Thavasianand Sankaranarayanan Syncfusion Team December 31, 2018 10:19 AM UTC

Hi Guia, 

Greetings from Syncfusion. 

As per your suggestion we have modified the format of number column valueAccessor property column in Grid. 

In the below code example we have shown the mentioned format for “Freight” column in Grid. 


@Html.EJS().Grid("FlatGrid").DataSource((IEnumerable<object>)ViewBag.dataSource).ShowColumnChooser(true).Columns(col => 
{    col.Field("EmployeeID").HeaderText("Employee ID").IsPrimaryKey(true).Width("120").Add(); 
    col.Field("CustomerID").HeaderText("Customer Name").Width("150").Add(); 
    col.Field("OrderDate").HeaderText("Order Date").Type("date").Format(format).Width("110").Add(); 
    col.Field("Freight").HeaderText("Freight").Width("120").ValueAccessor("valueAccess").Add(); 
    col.Field("ShipCountry").Visible(false).HeaderText("Ship Country").Width("150").Add(); 
}).AllowPaging().Render() 
 
<script> 
    function valueAccess(field, data, column) { 
        var format = "R$ "; 
        var value = data.Freight.toString(); 
        return format + value.replace('.', ','); 
    } 
</script> 


We have prepared a sample and it can be downloadable from the below location. 


Refer the help documentation. 


Regards, 
Thavasianand S. 



GU Guia January 3, 2019 04:34 PM UTC

Hi Thavasianand! 

i've tried but without success when my user type comma as a decimal separator (in this case i have validators that avoid this).
Actually, i've set my "locale" to pt-BR "Brazil" and the texts are translated correctly, but the currency and number types in the grid still are set to English.



i need to change my "number culture" to pt-Br so that my user can type the numbers with comma in decimal separator.


Thanks for the help!

Regards.
Guilherme



TS Thavasianand Sankaranarayanan Syncfusion Team January 4, 2019 05:07 AM UTC

Hi Guia, 
 
Query: I've tried but without success when my user type comma as a decimal separator (in this case i have validators that avoid this). Actually, i've set my "locale" to pt-BR "Brazil" and the texts are translated correctly, but the currency and number types in the grid still are set to English. i need to change my "number culture" to pt-Br so that my user can type the numbers with comma in decimal separator. 
 
Based on your requirement, we have prepared a sample. Here, we have applied both text translations and number format translations. Please find the below code example and sample for your reference. 
 
[code example] 
[Index.cshtml] 
 
<script> 
    ej.base.L10n.load({              // for text translations 
        'pt': { 
            'grid': { 
                EmptyRecord: 'Nenhum registro para exibir', 
                True: 'real', 
                ... 
 
            }, 
            'pager': { 
                currentPageInfo: '{0} de {1} páginas', 
                totalItemsInfo: '(Elementos {0})', 
                ... 
           } 
        } 
    }); 
</script> 
 
<div> 
    @Html.EJS().Grid("Grid").Locale("pt").DataSource((IEnumerable<object>)ViewBag.datasource).Columns(col => 
    { 
        ... 
 
    }).AllowPaging().EditSettings(edit => { edit.AllowAdding(true).AllowEditing(true).AllowDeleting(true).Mode(Syncfusion.EJ2.Grids.EditMode.Normal); }).Toolbar(new List<string>() { "Add", "Edit", "Delete", "Update", "Cancel" }).Render() 
</div> 
[_Layout.cshtml] 
... 
    <script> 
        function loadCultureFiles(name) {       //for number format translations 
            var files = ['numbers.json', 'timeZoneNames.json', 'currencies.json', 'ca-gregorian.json']; 
            var loadCulture = function (prop) { 
                var val, ajax; 
                ajax = new ej.base.Ajax(location.origin + '/../../scripts/cldr-data/main/' + name + '/' + files[prop], 'GET', true); 
                ajax.onSuccess = function (value) { 
                    val = value; 
                    ej.base.loadCldr(JSON.parse(val)); 
                }; 
                ajax.send(); 
                ej.base.setCulture('pt'); 
            }; 
            for (var prop = 0; prop < files.length; prop++) { 
                loadCulture(prop); 
            } 
        } 
        document.addEventListener('DOMContentLoaded', function () { 
            loadCultureFiles('pt'); 
        }); 
    </script> 
... 
 
 
Please find the sample in below link. 
 
 
Please get back to us if you need further assistance. 
 
Regards, 
Thavasianand S. 


Loader.
Live Chat Icon For mobile
Up arrow icon