Have you ever found a DropDownTree so overwhelming that you are having a hard time looking for the entry that you want? In this case, Kettic DropDownTree control provides you with a filtering capacity to help you with that. By enabling and customizing this filtering property, users can filter the entries instantly and find the entry you are looking for right away.

Kettic DropDownTree control allows you to apply and customize the filtering functions in various ways. You can filter entries that contain or start with a certain word, add hint message, filter by content / node text, highlight match word, and also set the minimum filter words.

Filter: Filter is the most basic property setting for the DropDownTree filtering functionality. At the moment this property allows two types of value setting. The first one is Contains, which, when applied, can return all the nodes that contain the searched text as a substring in the node text. The second one is StartWith, and it is also the default value for the filter property. Apply this value, and you will all the nodes with text that starts with the searched text.

EmptyMessage: This property is used to input a message in the search box before users input any text into it. This message can serve as a hint to the user for the filtering input.

FilterTemplate: Users can customize this property to filter entries in two methods. One way is to filter "ByContent". Applying this value, the filtering is implemented in the content of the corresponding node, that is, filtering is proceeded based on the text as well as the content bound to a certain node. If you are filtering "ByText", the filtering process only includes the node text.

Highlight: You can also customize this property to decide whether you want to highlight the matched search words or not. if you set the "Matches" value, highlighting is enabled if a node matches your search text. if you set "None", then even if a node matches your search it will not be highlighted.

MinFilterLength: You can customize this property to specify a minimum number of letters which should be typed before it proceeds with the filtering procedure.

If you want to apply the filtering functionality within a DropDownTree structure, you need to set true to EnableFiltering property, and then customize corresponding properties in FilterSettings with properties that has been introduced previously.

Aspx codes:

<kettic:PerDropDownTree ID="PerDropDownTree1" runat="server" Width="250" EnableFiltering="true"        
 Skin="Silk" >           
            <DropDownSettings Height="200" OpenDropDownOnLoad="true" />
            <ButtonSettings ShowClear="true" />
            <FilterSettings Highlight="Matches" Filter="StartsWith" EmptyMessage="Type here to find a contact" />
        </kettic:PerDropDownTree>

This is a demo screenshot: