Question

I’m using the quicksearch (https://github.com/riklomas/quicksearch) jQuery to hide elements in a table by entering text into a text box and then it only shows the ones that match.

This works fine, but I want to be able to clear the text box. I am using the following code to do that…

<script>
function clearsearch(){  
document.getElementById('id_search').value = "";
}
</script>

<a onclick="clearsearch()" id="clearsearch">Clear</a>

This also works fine at clearing the field, but the script doesn’t respond. I think the reason why it’s not responding is because when I clear it with the clear script above, I need to focus on the input and press the delete key.

Ex.) If I simply type text in the text box, and then delete it by hand, it works fine. If I run the clear script, and it deletes the text, the results don’t show. If I run the script, it deletes the text, and I press delete within the input the script responds.

Is there a way that I can first clear the text box, and then simulate the delete key within the text box?

Answer 1

It seems quicksearch is bound to the keyup event by default. Try triggering that.

$('#id_search').trigger('keyup');

You can also use jQuery to set the value:

$('#id_search').val('').trigger('keyup');