Category / Section
How to enable non case sensitive Grid sorting?
1 min read
Usually while sorting is performed, first preference is given to capital letters and then small letters. When you don’t want the discrimination between small and capital letters, you can set enableLocalizedSort API as ‘true’ to sort both small and capital letters.
Solution
In the following example, enableLocalizedSort is set as true in order to sort the column using non case and culture sensitive comparer function. The enableLocalizedSort API is used to perform localized sort operation.
The enabledLocalizedSort API to be set as true within the script tag for all the platforms as in the below snippet.
<script type="text/javascript">
$(function () {// Document is ready.
ej.support.enableLocalizedSort = true
</script>
Grid rendering code
JS
<div id="Grid"></div>
<script type="text/javascript">
$(function () {// Document is ready.
$("#Grid").ejGrid({
dataSource: window.gridData,
allowSorting: true,
sortSettings: { sortedColumns: [{ field: "CustomerID", direction: ej.sortOrder.Ascending }]},
allowPaging: true
columns: [
{ field: "OrderID", headerText: "Order ID", isPrimaryKey: true, textAlign: ej.TextAlign.Right, width: 100 },
{ field: "CustomerID", headerText: "Customer ID", width: 130 },
{ field: "Freight", headerText: "Freight", textAlign: ej.TextAlign.Right, width: 100, format: "{0:C}" },
{ field: "ShipCountry", headerText: "ShipCountry", width: 100 }
]
});
});
</script>
MVC
[In View]
@(Html.EJ().Grid<object>("Grid")
.Datasource((IEnumerable<object>)ViewBag.datasource)
.AllowSorting()
.SortSettings(sort => sort.SortedColumns(col => col.Field("CustomerID").Direction(SortOrder.Ascending).Add()))
.AllowPaging()
.Columns(col =>
{
col.Field("OrderID").HeaderText("Order ID").Width(75).Add();
col.Field("CustomerID").HeaderText("Customer ID").Width(110).Add();
col.Field("Freight").HeaderText("Freight").Width(75).Add();
col.Field("ShipCountry").HeaderText("Ship Country").Width(110).Add();
})
)
ASP.NET
[aspx]
<ej:Grid ID="OrdersGrid" runat="server" AllowPaging="True" AllowSorting="True">
<SortedColumns><ej:SortedColumn Field="CustomerID" Direction="Ascending" /></SortedColumns>
<Columns>
<ej:Column Field="OrderID" HeaderText="Order ID" IsPrimaryKey="True" />
<ej:Column Field="EmployeeID" HeaderText="Employee ID" />
<ej:Column Field="Freight" HeaderText="Freight" Format="{0:C}" />
<ej:Column Field="ShipCity" HeaderText="Ship City" />
</Columns>
</ej:Grid>
The following screenshot illustrates the output.
Localized sort operation
