title: jQuery UI Autocomplete DownArrow UpArrow
body: <p>I am having some issues with jQuery Autocomplete and moving DownArrow and UpArrow ?</p>
  
  <p>The problem seems to be that </p>
  
  <p><code>&lt;input id="autocomplete-input" value=""&gt;</code></p>
  
  <pre><code>focus: function (event, ui) {
         $('#autocomplete-input').val(ui.item.label);
   }
  </code></pre>
  
  <p>This works great for MOUSE focus - but when I use <code>arrowUp</code> and <code>arrowDown</code> - it selects the <code>ui.item.id</code> over and above the <code>ui.item.label</code></p>
  
  <p>How can I fix this so that either:</p>
  
  <ol>
  <li>the <code>input</code> val isn't changed at all [i.e. it keeps the users
  inputted term] </li>
  <li>it updates the <code>input</code> val with the <code>focused</code> val the user is on with keydown/keyup</li>
  </ol>
  
  <p>thanks</p>