diff --git a/ej2-asp-core-mvc/code-snippet/grid/sorting/foreign-sort-remote/foreign-sort.cs b/ej2-asp-core-mvc/code-snippet/grid/sorting/foreign-sort-remote/foreign-sort.cs new file mode 100644 index 0000000000..3c14d6b642 --- /dev/null +++ b/ej2-asp-core-mvc/code-snippet/grid/sorting/foreign-sort-remote/foreign-sort.cs @@ -0,0 +1,6 @@ +public IActionResult Index() +{ + return View(); +} + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/grid/sorting/foreign-sort-remote/razor b/ej2-asp-core-mvc/code-snippet/grid/sorting/foreign-sort-remote/razor new file mode 100644 index 0000000000..1e671fbad6 --- /dev/null +++ b/ej2-asp-core-mvc/code-snippet/grid/sorting/foreign-sort-remote/razor @@ -0,0 +1,7 @@ +@Html.EJS().Grid("grid").DataSource(dataManger => { dataManger.Url("/OData/Items").Adaptor("ODataV4Adaptor"); }).Height("348px").Columns(col => +{ + col.Field("OrderID").HeaderText("Order ID").IsPrimaryKey(true).Width("120").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add(); + col.Field("EmployeeID").ForeignKeyField("EmployeeID").ForeignKeyValue("FirstName").DataSource(dataManger => { dataManger.Url("/OData/Brands").Adaptor("ODataV4Adaptor"); }).HeaderText("Employee Name").Width("140").Add(); + col.Field("Freight").HeaderText("Freight").Width("120").Format("C2").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Add(); + col.Field("ShipCity").HeaderText("Ship City").Width("150").Add(); +}).Render() \ No newline at end of file diff --git a/ej2-asp-core-mvc/code-snippet/grid/sorting/foreign-sort-remote/tagHelper b/ej2-asp-core-mvc/code-snippet/grid/sorting/foreign-sort-remote/tagHelper new file mode 100644 index 0000000000..3e741016ce --- /dev/null +++ b/ej2-asp-core-mvc/code-snippet/grid/sorting/foreign-sort-remote/tagHelper @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/ej2-asp-core-mvc/grid/EJ2_ASP.MVC/sorting.md b/ej2-asp-core-mvc/grid/EJ2_ASP.MVC/sorting.md index 3c4519dd2e..e80950a28b 100644 --- a/ej2-asp-core-mvc/grid/EJ2_ASP.MVC/sorting.md +++ b/ej2-asp-core-mvc/grid/EJ2_ASP.MVC/sorting.md @@ -1,6 +1,6 @@ --- layout: post -title: Sorting in ##Platform_Name## Grid Component +title: Sorting in Syncfusion ##Platform_Name## Grid Component description: Learn here all about Sorting in Syncfusion ##Platform_Name## Grid component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Sorting @@ -156,6 +156,65 @@ The following example demonstrates how to perform sorting by enabling a foreign ![Sorting](images/sorting/sorting-local-forign.png) +**Sort foreign key column based on text for remote data** + +For remote data binding, the Grid performs sorting based on the `foreignKeyField` property defined in the column settings. This property should be mapped to the corresponding foreign key field in the data source. When sorting is applied, the Grid sends a request to the server with the `foreignKeyField` name, and the server is responsible for processing the sorting operation and returning the sorted data. Since the Grid relies on the server response, ensuring that the server correctly sorts the data before sending it back is essential for maintaining the expected order in the Grid. + +{% tabs %} +{% highlight cshtml tabtitle="CSHTML" %} +{% include code-snippet/grid/sorting/foreign-sort-remote/razor %} +{% endhighlight %} +{% highlight c# tabtitle="foreign-sort.cs" %} +{% include code-snippet/grid/sorting/foreign-sort-remote/foreign-sort.cs %} +{% endhighlight %} +{% endtabs %} + +The following code example describes the handling of sorting operation at the server side. + +``` + public class ItemsController : ODataController + { + [EnableQuery] + public IQueryable Get() + { + List GridData = JsonConvert.DeserializeObject(Properties.Resources.ItemsJson).AsQueryable().ToList(); + List empData = JsonConvert.DeserializeObject(Properties.Resources.BrandsJson).AsQueryable().ToList(); + var queryString = HttpContext.Current.Request.QueryString; + var allUrlKeyValues = ControllerContext.Request.GetQueryNameValuePairs(); + string key = allUrlKeyValues.LastOrDefault(x => x.Key == "$orderby").Value; + if (key != null) + { + if (key == "EmployeeID") { + GridData = SortFor(key); //Only for foreignKey Column ascending. + } + else if(key == "EmployeeID desc") { + GridData = SortFor(key); //Only for foreignKey Column descending. + } + } + var count = GridData.Count(); + var data = GridData.AsQueryable(); + return data; + } + + public List SortFor(String Sorted) + { + List GridData = JsonConvert.DeserializeObject(Properties.Resources.ItemsJson).AsQueryable().ToList(); + List empData = JsonConvert.DeserializeObject(Properties.Resources.BrandsJson).AsQueryable().ToList(); + if (Sorted == "EmployeeID") //Check whether ascending or descending. + empData = empData.OrderBy(e => e.FirstName).ToList(); + else if(Sorted == "EmployeeID desc") + empData = empData.OrderByDescending(e => e.FirstName).ToList(); + List or = new List(); + for (int i = 0; i < empData.Count(); i++) { + //Select the Field matching records. + IEnumerable list = GridData.Where(pred => pred.EmployeeID == empData[i].EmployeeID).ToList(); + or.AddRange(list); + } + return or; + } + } +``` + ## Perform sorting based on its culture Perform sorting based on culture in the Grid can be achieved by utilizing the [Locale](https://help.syncfusion.com/cr/aspnetmvc-js2/Syncfusion.EJ2.Grids.Grid.html#Syncfusion_EJ2_Grids_Grid_Locale) property. By setting the `Locale` property to the desired culture code, you enable sorting based on that specific culture. This allows you to apply locale-specific sorting rules and ensure accurate ordering for different languages and regions. diff --git a/ej2-asp-core-mvc/grid/EJ2_ASP.NETCORE/sorting.md b/ej2-asp-core-mvc/grid/EJ2_ASP.NETCORE/sorting.md index d72324797e..49a9a6a199 100644 --- a/ej2-asp-core-mvc/grid/EJ2_ASP.NETCORE/sorting.md +++ b/ej2-asp-core-mvc/grid/EJ2_ASP.NETCORE/sorting.md @@ -1,6 +1,6 @@ --- layout: post -title: Sorting in ##Platform_Name## Grid Component +title: Sorting in Syncfusion ##Platform_Name## Grid Component description: Learn here all about Sorting in Syncfusion ##Platform_Name## Grid component of Syncfusion Essential JS 2 and more. platform: ej2-asp-core-mvc control: Sorting @@ -156,6 +156,65 @@ The following example demonstrates how to perform sorting by enabling a foreign ![Sorting](images/sorting/sorting-local-forign.png) +**Sort foreign key column based on text for remote data** + +For remote data binding, the Grid performs sorting based on the `foreignKeyField` property defined in the column settings. This property should be mapped to the corresponding foreign key field in the data source. When sorting is applied, the Grid sends a request to the server with the `foreignKeyField` name, and the server is responsible for processing the sorting operation and returning the sorted data. Since the Grid relies on the server response, ensuring that the server correctly sorts the data before sending it back is essential for maintaining the expected order in the Grid. + +{% tabs %} +{% highlight cshtml tabtitle="CSHTML" %} +{% include code-snippet/grid/sorting/foreign-sort-remote/tagHelper %} +{% endhighlight %} +{% highlight c# tabtitle="foreign-sort.cs" %} +{% include code-snippet/grid/sorting/foreign-sort-remote/foreign-sort.cs %} +{% endhighlight %} +{% endtabs %} + +The following code example describes the handling of sorting operation at the server side. + +``` + public class ItemsController : ODataController + { + [EnableQuery] + public IQueryable Get() + { + List GridData = JsonConvert.DeserializeObject(Properties.Resources.ItemsJson).AsQueryable().ToList(); + List empData = JsonConvert.DeserializeObject(Properties.Resources.BrandsJson).AsQueryable().ToList(); + var queryString = HttpContext.Current.Request.QueryString; + var allUrlKeyValues = ControllerContext.Request.GetQueryNameValuePairs(); + string key = allUrlKeyValues.LastOrDefault(x => x.Key == "$orderby").Value; + if (key != null) + { + if (key == "EmployeeID") { + GridData = SortFor(key); //Only for foreignKey Column ascending. + } + else if(key == "EmployeeID desc") { + GridData = SortFor(key); //Only for foreignKey Column descending. + } + } + var count = GridData.Count(); + var data = GridData.AsQueryable(); + return data; + } + + public List SortFor(String Sorted) + { + List GridData = JsonConvert.DeserializeObject(Properties.Resources.ItemsJson).AsQueryable().ToList(); + List empData = JsonConvert.DeserializeObject(Properties.Resources.BrandsJson).AsQueryable().ToList(); + if (Sorted == "EmployeeID") //Check whether ascending or descending. + empData = empData.OrderBy(e => e.FirstName).ToList(); + else if(Sorted == "EmployeeID desc") + empData = empData.OrderByDescending(e => e.FirstName).ToList(); + List or = new List(); + for (int i = 0; i < empData.Count(); i++) { + //Select the Field matching records. + IEnumerable list = GridData.Where(pred => pred.EmployeeID == empData[i].EmployeeID).ToList(); + or.AddRange(list); + } + return or; + } + } +``` + ## Perform sorting based on its culture Perform sorting based on culture in the Grid can be achieved by utilizing the [locale](https://help.syncfusion.com/cr/aspnetcore-js2/syncfusion.ej2.grids.grid.html#Syncfusion_EJ2_Grids_Grid_Locale) property. By setting the `locale` property to the desired culture code, you enable sorting based on that specific culture. This allows you to apply locale-specific sorting rules and ensure accurate ordering for different languages and regions.