Customizing the Filter Function

In This Topic

You may want to customize the filter function so that you can have more control over the results listed for users. You can use the OnClientFilterCallback function to customize the filter.

Using the application you created in the Setting the Filter Function topic, complete the following steps:

Create a function that will be used to filter the data on the page. Insert the following script between the <head> </head> tags on your page:


<script type="text/javascript">
           function filterFunction(text, searchValue)
           {
                // this function will make filter matching from the beginning of the string.

                 return !(text.slice(0, searchValue.length).toLowerCase() == searchValue.toLowerCase());
           }
        </script>

Set the OnClientFilterCallback event to "filterFunction":
<cc1:C1ListView ID="C1ListView1" runat="server" Filter="true" OnClientFilterCallback="filterFunction">
Press F5 or start debugging to run your application. When you type in the search bar, the filter will only return list items that match what you've typed from the beginning of the string: