How to highlight items find by the filter

[Gers]

Is there a way to highlight items find by the filter in a treeList ?

 I Want this behavior:  http://jsfiddle.net/fosxumcb/  but using kendo provided  filter

[Nikolay Rusev]

Hello Gers,

 

The widget which you are referring is not a TreeList, but a TreeView.

 

The widget doesn't have such functionality. There is also a JavaScript error when you try to search in the example which is due to this line `$(treeViewId + ' li.k-item').expand(".k-item");`.  You are calling expand to jQuery object rather than to the TreeView instance.

 

The following article shows how to use expand method correctly.

 

Regards,
Nikolay Rusev
Telerik

 

 

[Gers]

I know it's a treeView but In my case i'm using a treeList. I just want the same behavior but using a treeList. I just want to know if there is a way to highlight the item found by the treelist filter.

[Nikolay Rusev]

Hello Gers,

 

`I just want to know if there is a way to highlight the item found by the treelist filter` - No, there isn't built-in way to highlight items based on filters.

 

Regards,
Nikolay Rusev
Telerik

 

 

[Hayden]

Hi Nikolay,

Has there been any updates regarding highlighting or showing the filtered item in an Angularjs TreeList child element?

 

Thanks,
Hayden

 

[Stefan]

Hello, Hayden,

This is still not supported out of the box, but it could be implemented using custom logic. It will require locating the searched elements using the dataItem and then apply a custom class to them.

I made an example demonstrating an approach which could be used:

https://dojo.telerik.com/IBAKaGaC
 
Please have in mind that depending on the real application this could need further modifications.

Regards,
Stefan
Progress Telerik

[Hayden]

Hello Stephan,

Thanks for the reply and the example. I have a few more questions based on your response:

1. Is it possible (with custom logic) to expand rows to show a sub row that was matched by a search (e.g. in your example if the rows were not expanded by default and the user typed "Weber" in the search could the two rows about the "Buffy Weber" row expand to show the match?

2. Would these TreeList component customizations be possible on the Angularjs version of this component too (the example is in jquery).

 

Thanks for the help,

Hayden

[Stefan]

Hello, Hayden,

Regarding the questions:

1) Currently, there is no straightforward approach to do this as if we search in the data we have no information if this data is visible or not. Also, even if we find the item and locate that is not visible, it could be nested in N-levels and we may need to go up recursively to check to which level the nodes are expanded and which levels have to be expanded.

2) These customizations are possible when using the AngularJS(not Angular 2+) version of the widgets as the Directives are wrappers over the jQuery widgets and the rendering and the functionalities are the same.

If you need further assistance with the searching functionality, I can recommend our Professional Services team which will be able to provide a solution that will be custom made for the real application covering the specific scenarios and requirements:

https://www.progress.com/services/outsourcing/feature-customization

Let me know if you need additional details on this matter.

Regards,
Stefan
Progress Telerik