title: jquery autocomplete - selected value disappears from textbox
body: <p>I have written a custom jquery autocomplete function to display certain values and textfields to update on selecting the value as per the code below:</p>
  
  <pre><code>&lt;input type="text" name="promoitem" id="promoitem"&gt;
  
  $('#promoitem').autocomplete({
          source: "BckProcesses/GetPromoItems.asp",
          create: function() {
              $(this).data('ui-autocomplete')._renderItem = function(ul, item) {
                  return $('&lt;li&gt;')
                  .append('&lt;a&gt;' + item.promodesc + '&lt;/a&gt;')
                  .appendTo(ul);
              }
          },
          select: function(event, ui) {
              $('#promoitem').val(ui.item.promodesc); 
              $('#promocost').val(ui.item.promocost);
              $('#promoqty').val(ui.item.qty);
              $('#hidden_promo_item_id').val(ui.item.id);
          }
      });
  </code></pre>
  
  <p>This is what is return by the source file (GetPromoItems.asp)</p>
  
  <pre><code>[{"id": "1", "promodesc": "Ipad 4 ", "promocost": "200", "qty": "1"},{"id": "2", "promodesc": "Village Tickets", "promocost": "20", "qty": "2"}]
  </code></pre>
  
  <p>However, when I select the value from the ul, everything gets populated except the promoitem textfield. That fields goes to being blank.</p>
  
  <p>Can anyone please let me know what could be causing this?</p>
  
  <p>Thanks
  Sam</p>