title: How do I cancel autocomplete with jqueryui?
body: <p>I have an input field which has an ajax data source autocomplete attached to it.</p>
  
  <p>I have a keyup handler for the input field, which looks for someone pressing enter and when they do it triggers a click on the search button, which ajax loads some data in another div.</p>
  
  <p>The problem is that if the person is quick and types and presses enter, the autocomplete still pops up.</p>
  
  <p>I have tried the following:</p>
  
  <ul>
  <li><p>Adding <code>$('#autocomplete').autocomplete('close')</code>. This doesn't work, presumably because the autocomplete isn't open yet. If I type, wait for the autocomplete to come up, then press enter, it closes it correctly.</p></li>
  <li><p>Adding <code>$('#autocomplete').autocomplete('destroy')</code>. This works, but then if I go back to the field to try another search, the autocomplete no longer works.</p></li>
  </ul>
  
  <p>So what I want is a way to cancel any pending requests and close the autocomplete if it's open, but without disabling or destroying it.</p>
  
  <p>EDIT: Code sample (not my real code, just stubs to demonstrate the issue). Filename is scratch.php</p>
  
  <pre><code>&lt;?php
  // Stub for search results
  if ($_GET['search'])
  {
      print "Search results for ".$_GET['search']." here";
      exit();
  }
  
  // Simulated DB search
  if ($_GET['term'])
  {
      print '[{"label":"A 1"},{"label":"A 2"},{"label":"A 3"},{"label":"A 4"}]';
      exit();
  }
  ?&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;script src="http://code.jquery.com/jquery-1.9.1.min.js"&gt;&lt;/script&gt;
      &lt;script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"&gt;&lt;/script&gt;
      &lt;link type="text/css" href="http://code.jquery.com/ui/1.10.1/themes/redmond/jquery-ui.css" rel="stylesheet" /&gt;
      &lt;script language='javascript'&gt;
      $(document).ready(function() {
          $('#searchfor').on('keyup',function(e) {
              if (e.which == 13) $('#search').trigger('click');
          });
          $('#searchfor').autocomplete({
              source: "/scratch.php",
              minLength: 2,
              select: function( event, ui ) {
                  $('#searchfor').val(ui.item.value);
                  $('#search').trigger('click');
              }
          });
          $('#search').on('click',function() {
              try
              {
                  // Cancel any pending autocompletes without destroying the autocomplete completely here.
                  // This currently doesn't work
                  $('#searchfor').autocomplete("close");
              }
              catch(e)
              {
                  // Do nothing except prevent an error
              }
              $('#results').load('scratch?search='+encodeURIComponent($('#searchfor').val()));
          });
      });
      &lt;/script&gt;
  &lt;/head&gt;
  &lt;input id='searchfor' /&gt; &lt;input id='search' type='button' value='search' /&gt;
  &lt;div id='results'&gt;&lt;/div&gt;
  &lt;/html&gt;
  </code></pre>