Reset hideseek

[sombodi]

Hi, thanks for the great plugin. I need a method for reseting to initial state so that other type of filters can act on unfiltered list.

Thanks!

[hectorprats]

+1

[scannermobs]

Any movement on this? Users having to delete form contents manually is bad UX. I would really like reset and update methods.

Cheers

[mlynarczyk]

its bound to keyup event hence you could $('#your_input_id').val('').trigger('keyup');

[maximmis]

thanks @mlynarczyk , worked just fine!

<button onclick="$('#search_field_id').val('').trigger('keyup').focus();" type="button"></button> (added .focus() for user convenience in case of another search).

Still, @vdw should implement this inside the plugin itself - something like:

$('#search').hideseek({ clear: '.class_of_clearing_element' });

Thanks @vdw for the cool plugin anyway!

[barbedCoil]

@vdw Great plugin but a clear method would be very useful - I can't use this as my clients always asks for an 'X" button to clear the searclh which does not work no matter what with Chrome @maximmis comments with <button onclick="..." does not work in Chrome

UPDATE

The following works in Chrome, essentially clearing the search field then sending backspace key to the field:

onClearSearch: function ()
{
    $('#search').val("").trigger("keyup").focus();
    var press = jQuery.Event("keypress");
    press.bubbles = true;
    press.cancelable = true;
    press.charCode = 8;
    press.currentTarget = $("#search")[0];
    press.eventPhase = 2;
    press.keyCode = 8;
    press.returnValue = true;
    press.srcElement = $("#search")[0];
    press.target = $("#search")[0];
    press.type = "keyup";
    press.view = Window;
    press.which = 8;
    $("#search").trigger(press);
},

[MrMooky]

I'm having an odd issue while resetting the field (tested in latest versions of Chrome, Firefox and Safari):

I'm trying to empty the fields value and trigger a keyup: $('input#search-events').val('').trigger('keyup');

The only thing happening is the value being emptied. The keyup does not seem to affect anything. When I click into my searchfield and hit backspace, it's fine.

I can even prefill the field with a word, now the trigger keyup is working: $('input#search-events').val('someword').trigger('keyup');

How do I accomplish a keyup with an empty value?

[barbedCoil]

@MrMooky If you look at my Update above you will see the onClearSearch function which does work for me.

Here is my html where you can see I added a pseudo button as a span that basically is my 'clear' button:

            <div class="input-group" style="margin-bottom: 10px; margin-left: 0;">
                <input id="search" name="search" placeholder="Type here to search.."
                       type="text" autocomplete="off" class="form-control"
                       style="margin-left: 0; max-width: 100% !important; width: 100% !important;">
                <span class="input-group-addon" style="cursor: pointer;" title="Click to Clear search" v-on:click="onClearSearch()">
                    <i class="fa fa-times"></i>
                </span>
            </div>

You can see the v-on:click="onClearSearch() which calls that function in my post above - this is a vue.js click event - binding the span with an id as a jquery variable would work in a similar fashion.

The code and markup are in production on my app and seems to be working

[maximmis]

@MrMooky Maybe this live implementation will help (searchbox is under the header image): http://shahmat.co.il/openings.html

My clearing function:

$('.clear-search').on('click', function(event){
        event.preventDefault();
        $('#search').val('').trigger('keyup').focus();
 });

[crusnac]

I attempted to leverage this:

$('.clear-search').on('click', function(event){ event.preventDefault(); $('#search').val('').trigger('keyup').focus(); });

The user still hit the backspace in order to "reset" the search. Ideally there should be a reset method. Any ideas on how to get this fixed?

[maximmis]

@crusnac The 'X' did not clear the search for you? On Chrome & FF the button clears the field without using backspace...

[crusnac]

Yes, for some reason this is not working. The content of the search box is removed, but it never resets that form.

[kristinakiosk]

This is working for me var kp = jQuery.Event("keyup"); kp.which = kp.keyCode = 8; jQuery('#search').val('').trigger(kp);

[damienvancouver]

Complete working code with button and javascript event handler:

First, the button, put in your HTML beside your <input id="search"> ... <input type="button" class="clear-search" value="X">

Now, add the following Javascript on the page:

 // search reset button 
  $('.clear-search').on('click', function(event){
       event.preventDefault();
       var kp = jQuery.Event("keyup"); 
       kp.which = kp.keyCode = 8;
       jQuery('#search').val('').trigger(kp);
 });