This is a migrated thread and some comments may be shown as answers.
Sorting on Foreign Key column
5 Answers 118 Views
This is a migrated thread and some comments may be shown as answers.
Bhoopendra
Top achievements
Rank 1
Bhoopendra asked on 05 Apr 2016, 04:14 PM
In our application to display data we are using Kendo Grid with Foreign Key columns. We are facing problem while sorting these Foreign Key columns. If we try to sort the column, it is getting sorted by Id instead of column text.

We tried to implement the solution given at http://docs.telerik.com/kendo-ui/controls/data-management/grid/how-to/foreign-key-column-sorting-by-text . but this solution is working at client side but it is not working at server side application.

Do we have any way to achieve this?

5 Answers, 1 is accepted

Sort by
0
Boyan Dimitrov
Telerik team
answered on 07 Apr 2016, 08:21 AM

Hello Bhoopendra,

 

Please refer to the following forum thread, where same problem is discussed and there are some workarounds provided. 

 

Regards,
Boyan Dimitrov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Bhoopendra
Top achievements
Rank 1
answered on 07 Apr 2016, 02:35 PM

Hi Boyan,

We have already have gone through the link http://docs.telerik.com/kendo-ui/controls/data-management/grid/how-to/foreign-key-column-sorting-by-text .On this link Javascript code has been provided but we need to implement it into views.

We appreciate if you can provide us code segment equivalent to this script which can be used in views (MVC)?

 

0
Boyan Dimitrov
Telerik team
answered on 11 Apr 2016, 10:52 AM

Hello Bhoopendra,

The same approach is not applicable for the MVC wrapper due to the way how MVC wrappers are being configured. There is no way to configure a calculated column in the DataSource configuration with the razor.

A possible workaround would be to have a custom column (hidden in the UI) that holds the text for each Category (the foreign key itself is bound to the integer column). When user tries to sort the foreign key you can explicitly sort the DataSouce by the hidden column. Please refer to the code snippets below: 

columns.Bound(p => p.CategoryName).Hidden();
        columns.ForeignKey(p => p.CategoryID, (System.Collections.IEnumerable)ViewData["categories"], "CategoryID", "CategoryName")
            .Title("Category").Width(200).Sortable(false);
.Events(ev => ev.Save("save"))


function save(e) {
       // this code finds what is the text value associated with the selected CategoryID (number)and sets the hidden column to this text
        e.model.set("CategoryName", this.columns[2].values[e.values.CategoryID - 1].text);      
    }

$(document).ready(function () {
        //since the sorting is disabled for this column you can bind to the click of the header and perform custom sorting by the hidden column
        $("th[data-field='CategoryID']").click(function (e) {          
            $("#grid").data().kendoGrid.dataSource.sort({ field: "CategoryName", dir: "desc" });
        })
    });

Please note that such scenario is not officially supported and some custom logic should be implemented. In the example above it is shown some sample code that does not include validation logic and etc. 

Regards,
Boyan Dimitrov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Raja Patukuri
Top achievements
Rank 1
answered on 01 Oct 2020, 12:59 PM

Hi Boyan,

Thank you for your reply. The answer you provided would be definitely useful but it is just doing Descending on click of the column header but not Ascending. And up and down arrows on the column header are missing. Can you please extend the answer to full fill these requirements since usually everybody needs it.

0
Tsvetomir
Telerik team
answered on 05 Oct 2020, 07:03 AM

Hi Raja,

The sort of the foreignkey column by the text and not the ID has been discussed in the forum thread below:

https://www.telerik.com/forums/sort-by-foreign-key-text#FoYpnCuUFEi915Q0cRjsFA

Give the approach above a try and let me know if there is a need for additional details.

 

Kind regards,
Tsvetomir
Progress Telerik

Five days of Blazor, Angular, React, and Xamarin experts live-coding on twitch.tv/CodeItLive, special prizes, and more, for FREE?! Register now for DevReach 2.0(20).

Tags
Grid
Asked by
Bhoopendra
Top achievements
Rank 1
Answers by
Boyan Dimitrov
Telerik team
Bhoopendra
Top achievements
Rank 1
Raja Patukuri
Top achievements
Rank 1
Tsvetomir
Telerik team
Share this question
or