JQueryUI自動完成功能不會從選擇框中更新其數據屬性

Question

例

$('select').change(function(){
      $('#auto').attr('data-id',$(this).val())
})

$('#auto').autocomplete({
    delay: 1000,
    source: function( request, response ) {  
            alert($(this.element).data('id'))
            return false
    }
 })

<select name="category">
    <option value="A">A</option>
    <option value="B">B</option>
    <option value="C">C</option>
</select>

<input id="auto" data-id="A" type="search"/>

當有人在選擇框中選擇一個選項時，我想更新自動輸入數據屬性。

有什么方法可以防止自動完成輸入緩存其數據屬性？ 第一次將選擇框中的選項從A更改為B時，輸入即可更新data-id 。 但是，當我從B更改為C ，輸入仍在提醒B而不是C $(this.element).data('id')不是獲取最新數據屬性的適當方法？

Answer 1

直接從select控件中選擇值怎么樣？

$('#auto').autocomplete({ 
   delay: 100,
   source: function( request, response ) {  
      var selected = $('select[name="category"] option:selected'), 
          isSomethingSelected = selected.length == 1,
          selectedVal = isSomethingSelected ? 
                        selected.val() :  
                        $('select[name="category"] option:first').val();
      alert(selectedVal);
      return false;
   }
});

見JSFiddle