If you’re using Selectize to power your dropdown menus, you may find yourself wishing that when the user clicks the dropdown menu, the current value in the control would be cleared, leaving behind only a blinking cursor and the dropdown menu. This would make it very clear that the two options available to them are to start typing or click a dropdown item. However, the default Selectize behavior is to leave the previously selected value in the control with the cursor at the end of it so that the user has to know to hit backspace before they can begin typing, which is a bit counterintuitive.

Here’s how to clear a selectize control on dropdown click:

Further documentation is here.


  1. andres November 15, 2016 at 5:38 am


    Perfect post.
    Thanks a lot

  2. KK January 16, 2018 at 3:26 am


    Thanks so much! I’ve been using the wrong clear and cleared all options. smh

Leave a reply

Your email address will not be published. Required fields are marked *