Add Double-click Event to Search Box

adisa

I looked through the documentation but I haven't been able to find a way to add a double-click event/function to the search box. I would like to clear the search box filter with a double click. Can anyone help?

allan

Just add it using jQuery? $('input div.dataTables_filter').dblclick( function () { $(this).val(''); $(this).keypress(); } );. (the keypress call will cause DataTables to run the filter again).

Allan

adisa

Thanks for your reply Allan. I'm a bit of a newbie and I tried the code as shown below and a few other scenarios. Am I a using it wrong?

$(document).ready(function () {
$('#example').dataTable();

$('input div.dataTables_filter').dblclick(function () { $(this).val(''); $(this).keypress(); });

});

allan

No that's right, but I made a mistake - sorry...:

[code]
$(document).ready(function () {
$('#example').dataTable();
$('div.dataTables_filter input ').dblclick(function () { $(this).val(''); $(this).keypress(); } );
});
[/code]
Allan

adisa

Thanks again Allan. The code that you left cleared the search box but it didn't reset the table results. I added "oTable.fnFilter('');" to the code as shown below and it works great.

$('div.dataTables_filter input ').dblclick(function () { $(this).val(''); $(this).keypress(); oTable.fnFilter(''); });