How to clear jquery mobile list filter?

Question

I have a jQuery Mobile application (1.0rc1) that looks like a list with a search filter implemented. It looks like this pattern.

Under certain conditions, I dynamically load additional items into the list using an ajax call. When this happens, I want to delete everything that was entered in the search filter, otherwise I get a partially filtered list.

I tried shooting a clear button as follows:

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

and clear the form as follows:

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

but no one worked. Can someone enlighten me properly to accomplish this?

Answer 1

You must clear the search filter with

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

Edit: To update the list, you also need to call the "change" -event in the search filter:

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

Jsfiddle

Answer 2

I am using the following code:

 $("form")[0].reset(); 

[0] points to the method of the DOM element. Also see How to reset a form via JavaScript?

Answer 3

if you are talking about jquery mobile listview you need this

 $('#autocomplete li').click(function () { $('.ui-input-clear').trigger("click"); });