Kendo Filter widget can support relative fields for filtering ?

2 Answers 216 Views
Filter
Vishwas
Top achievements
Rank 1
Iron
Vishwas asked on 26 Jan 2022, 02:40 PM

I am trying to implement filter which can support relative fields i.e. the first field would be table names once user choose any table then second field gets populated with all columns available for selected table. Now users can choose operator and pass value for filtering the column value. So basically I want to filter on basis of column's value. As I dont want to put all columns for all tables in one field because that makes my drop down very long as I have huge columns in some table and also user wont be able to search specific column easily hence I want to introduce one more field which is table drop down. Once user select from table drop down then column dropdown will only have selected table column which reduce the columns number and user can choose easily. see the attached screenshot for same.  So the expression preview should be something like <field1-N>.<field2-N> <operator> <value> e.g. "table1.column5 is equal to myvalue". How we can achieve this ? I tried using editortemplate of field property of kendo Filter widget and added field 2 as shown in attached screen shot but after that not able to get field 2 value in expression. Can someone suggest what are the other ways we can achieve this ?

2 Answers, 1 is accepted

Sort by
0
Accepted
Vishwas
Top achievements
Rank 1
Iron
answered on 08 Feb 2022, 10:48 AM

I have recieved the answer by Telerik support team. We can use jquery event handler on filter to insert new drop down list and tweak the existing drop downs please see the below dojo example : 

https://dojo.telerik.com/@gdenchev/OYeROliP  

0
Nikolay
Telerik team
answered on 31 Jan 2022, 11:07 AM

Hi Vishwas,

To overcome the long DropDownList with all model fields I would recommend enabling a search input and setting a height for the suggestion popup window. This can be done by using the setOptions() method in the change event of the Filter widget:

change: function(e) {
              var dropdown = e.sender.element.find("[data-bind='value: field']").data("kendoDropDownList");
              dropdown.setOptions({
                filter: "contains",
                height: 120,
              });
            }

Here is a Dojo demo demonstrating this:

https://dojo.telerik.com/uYeCulaW/2

When it comes to the full requirement you have it is quite a customization and hardly can be achieved with the current API of the Filter widget. I can suggest submitting a feature request for it or contacting Progress Professional services which specialize in custom-tailored solutions and complete implementations.

Regards,
Nikolay
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Tags
Filter
Asked by
Vishwas
Top achievements
Rank 1
Iron
Answers by
Vishwas
Top achievements
Rank 1
Iron
Nikolay
Telerik team
Share this question
or