How can I programmatically clear the DropDownList filter?

5 posts, 0 answers
  1. Johnathan
    Johnathan avatar
    3 posts
    Member since:
    Mar 2015

    Posted 19 Jun 2015 Link to this post

    I am using Javascript and have a kendo drop down list like so:

    dataTextField: "name",
    dataValueField: "id",
    filter: "contains",

    dataSource: {
        data: [
          {id: 1, name: "apples"},
          {id: 2, name: "oranges"},
          {id: 3, name: "apples2"},
          {id: 4, name: "oranges2"}]


    As a user, I open the drop down list, type "apples" into the filter, and select "apples".  Then I activate a function (though clicking a button), that attempts to programmatically change the drop down list to the "oranges" value (index 1, id 2).  However, the filterInput is still active, and attempts to set the drop down list to index 1 instead sets it to index 1 of the filtered drop down list ("apples2").

    I know I can access the filterInput programmatically.  How can I programmatically clear the filterInput and set the drop down list value to "oranges"?

  2. Plamen Lazarov
    Plamen Lazarov avatar
    135 posts

    Posted 23 Jun 2015 Link to this post


    In order to clear the filter input get an instance of the widget and clear the filter of it's dataSource first.

    Please refer to the demo below which illustrates this approach.


    Plamen Lazarov
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Johnathan
    Johnathan avatar
    3 posts
    Member since:
    Mar 2015

    Posted 23 Jun 2015 in reply to Plamen Lazarov Link to this post

    That worked perfectly!  Thank you so much!
  4. Neil
    Neil avatar
    35 posts
    Member since:
    Dec 2019

    Posted 07 Mar Link to this post

    Is there any example here that actually reads from a table in database?..

    Because I've been missing something here. I am getting null values in my parameter. 

    I have this:

       dataTextField: 'userName',
       dataValueField: 'userId',


    How do I actually tell my function to get the value?

     ReadUser(string text, string userName, string value)

    Here's my function, and it is always null.. What did i miss?.. just give an example.

  5. Dimitar
    Dimitar avatar
    457 posts

    Posted 10 Mar Link to this post

    Hello Neil,

    Kendo UI DropDownList demos retrieve data from a service and its code is available on GitHub. An alternative of its code may be found in the demos of DropDownList for Telerik UI for ASP.NET MVC, e.g. Binding to remote data, Server filtering. They show how to retrieve data withing the Controller. The code is available in demo's Source code viewer.

    Progress Telerik

    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top