How do I clear the JQuery Mobile list search filter?

Question

I have a JQuery Mobile (1.0rc1) application that has a list view with a search filter implemented. It's similar to this sample.

Under certain conditions, I am dynamically loading additional items into the list with an ajax call. When this happens I want to clear anything entered in the search filter, otherwise I end up with a partially filtered list.

I've tried firing the clear button like this:

$('.ui-button-clear', $.mobile.activePage).click();

and clearing the form like this:

$("form > input", $.mobile.activePage).val('');

but neither worked. Can someone enlighten me to the proper way to accomplish this?

Answer 1

You should be able to clear clear the searchfilter with

$('input[data-type="search"]').val("");

Edit: To update the list you will also have to trigger the "change"-event on the searchfilter:

$('input[data-type="search"]').trigger("keyup");

JSFiddle