How to enable Localization in Grid?

1 min read

By default, the Grid contains Locale property. To enable localization, specify the culture name as follows.

$C:\Users\ApoorvahR\Desktop\Note.png$ Note: Refer to the corresponding script file to the project.

<head>
    <link href="~/themes/bootstrap.min.css" rel="stylesheet" />
    <link href="http://cdn.syncfusion.com/13.2.0.29/js/web/flat-azure/ej.web.all.min.css" rel="stylesheet" />
    <script src="http://cdn.syncfusion.com/js/assets/external/jquery-2.1.4.min.js"></script> 
    <script src="http://cdn.syncfusion.com/js/assets/external/jquery.easing.1.3.min.js"></script>
    <script src="http://cdn.syncfusion.com/js/assets/external/jsrender.min.js"></script>
    <script src="http://cdn.syncfusion.com/js/assets/external/jquery.globalize.min.js"></script>
    <script src="~/scripts/cultures/globalize.culture.en-GB.min.js"></script>
    <script type="text/javascript" src="~/scripts/ej.web.all.min.js"></script>
</head>
<div id="Grid"></div>
<script type="text/javascript">
    $(function () {
        $("#Grid").ejGrid({
            locale: "en-GB",
            columns: [
            { field: "OrderID", headerText: "Order ID", isPrimaryKey:true},
            { field: "CustomerID", headerText: "Customer ID" }
            ]
        });
    });
</script>

MVC

[Index.cshtml]
@(Html.EJ().Grid<OrdersView>("FlatGrid")
.Locale("en-GB")
.Columns(col =>
{
col.Field("OrderID").HeaderText("Order ID").IsPrimaryKey(true).TextAlign(TextAlign.Right). Add();
col.Field("CustomerID").HeaderText("Customer ID"). Add();
col.Field("Freight").HeaderText("Freight"). Add();
col.Field("ShipCountry").HeaderText("Ship Country "). Add();
}))
[_Layout.cshtml]
<head>
<meta charset="utf-8" />
   <link href="~/themes/bootstrap.min.css" rel="stylesheet" />
    <link href="http://cdn.syncfusion.com/13.2.0.29/js/web/flat-azure/ej.web.all.min.css" rel="stylesheet" />
    <script src="http://cdn.syncfusion.com/js/assets/external/jquery-2.1.4.min.js"></script> 
    <script src="http://cdn.syncfusion.com/js/assets/external/jquery.easing.1.3.min.js"></script>
    <script src="http://cdn.syncfusion.com/js/assets/external/jsrender.min.js"></script>
    <script src="http://cdn.syncfusion.com/js/assets/external/jquery.globalize.min.js"></script>
    <script src="~/scripts/cultures/globalize.culture.en-GB.min.js"></script>
    <script type="text/javascript" src="~/scripts/ej.web.all.min.js"></script> 
    <script type="text/javascript" src="~/scripts/common/ej.unobtrusive.min.js"></script>
</head>
<body>
@RenderBody()
@Html.EJ().ScriptManager()
</body>

ASP.NET

[.aspx]
<ej:Grid ID="OrdersGrid" runat="server" Locale="en-GB" >
<Columns>
<ej:Column Field="OrderID" HeaderText="Order ID" IsPrimaryKey="True" TextAlign="Right" />
<ej:Column Field="CustomerID" HeaderText="Customer ID" />
<ej:Column Field="Freight" HeaderText="Freight" />
<ej:Column Field="ShipCountry" HeaderText="Ship Country" />
</Columns>
</ej:Grid>
Site.Master]
<head id="Head1" runat="server">
<link href="~/themes/bootstrap.min.css" rel="stylesheet" />
    <link href="http://cdn.syncfusion.com/13.2.0.29/js/web/flat-azure/ej.web.all.min.css" rel="stylesheet" />
    <script src="http://cdn.syncfusion.com/js/assets/external/jquery-2.1.4.min.js"></script> 
    <script src="http://cdn.syncfusion.com/js/assets/external/jquery.easing.1.3.min.js"></script>
    <script src="http://cdn.syncfusion.com/js/assets/external/jsrender.min.js"></script>
    <script src="http://cdn.syncfusion.com/js/assets/external/jquery.globalize.min.js"></script>
    <script src="~/scripts/cultures/globalize.culture.en-GB.min.js"></script>
    <script type="text/javascript" src="~/scripts/ej.web.all.min.js"></script> 
    <script type="text/javascript" src="~/scripts/common/ej.webform.min.js"></script>
<asp:ContentPlaceHolder ID="HeadContent" runat="server">
</asp:ContentPlaceHolder>
</head>

The following screenshot illustrates the output.

Localization in Grid

Did you find this information helpful?

Yes

How to enable Localization in Grid?

Access denied