jQuery UI Autocomplete: Clear Previous Search Term

Question

On the keydown event of the jQuery UI Autocomplete widget the default case statement has the following code:

default:
    // keypress is triggered before the input value is changed
    clearTimeout( self.searching );
    self.searching = setTimeout(function() {
        // only search if the value has changed
        if ( self.term != self.element.val() ) {
            self.selectedItem = null;
            self.search( null, event );
        }
    }, self.options.delay );
    break;

From what I can see the sixth line of the above code prevents execution if the user types in the same value twice. This makes sense most of the time but in my scenario it is causing a problem.

I am building an ajax application that has a fixed header with a search input at the top. The user can type in anything they want into the search box and a div will pop up with the search results matching their query. If the user types in 'abc' and clicks on a result, it loads the corresponding page via ajax and clears the search box. The problem is that if they user types in 'abc' again, the search method is not fired as what they typed in matches what they last searched for.

Is there a way to clear the self.term value stored within the widget when the user clicks on a search result? Or is there another way to resolve my problem without having to cook up my own version of the Autocomplete widget?

Thanks

Answer 1

Doing the following resets the previous search term:

 $('#AutocompleteElementID').data().autocomplete.term = null;

If you do the following when an item is selected, it will clear the previous search term and make the widget perform a search if they type in the same value again.

Answer 2

Unfortunately,

$(this).data().autocomplete.term = null;

does not clear the input field. To do so, the following works:

close: function(event, ui)  {
      // Close event fires when selection options closes
      $('input')[0].value = ""; // Clear the input field 
      }

Answer 3

if the autocomplete function returns self, for your autocomplete element you should just be able to call

$yourAutoCompleteElement.term = null;

when you want to clear it.

Answer 4

            close:          function(event, ui)
                                {
                                // Close event fires when selection options closes

                                $(this).data().autocomplete.term = null; // Clear the cached search term, make every search new
                                },

Answer 5

This DID NOT work for me:

$(this).data().autocomplete.term = null;

However this DID work for me in jQuery UI - v1.10.2:

$(this).data().term = null;

Answer 6

You should try :

$("#AutocompleteElementID").autocomplete("instance").term = null;

Let me know if it works for you