如何在jQuery UI中爲多個自動填充文本框和隱藏字段分配一個值？

Question

我有多個自動完成文本框與多個隱藏字段配對。我怎麼做？防爆。 textbox1：name = hiddenfield1：Id，textbox2：name = hiddenfield2：Id。 我已經能夠做1自動完成和1隱藏字段的工作。

這裏是我的腳本代碼：

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('.auto').autocomplete({ 
      source: "search.php", 
      focus: function(event, ui) { 
       $(idField).val(ui.item.value); 
       $(this).val(ui.item.label); 
       return false; 
      }, 
      select: function(event, ui) { 
       $(this).val(ui.item.label); 
       $("#hidden").val(ui.item.value); 
       return false; 
      } 
      //minLength: 3 
     }); 
    }); 
</script> 

<p>Type the name of a band: <input type="text" class="auto" /></p> 
<p>Type the name of a band: <input type="text" class="auto" /></p> 

<input name="hidden" id="hidden" type="hidden" /> 
<input name="hidden" id="hidden" type="hidden" /> 

先生/女士你的答案會有很大的幫助，非常感謝。

Answer 1

首先，您需要所有輸入字段的唯一標識符，隱藏或不隱藏。然後給它們賦值會容易很多。你真的很近，我只改變一些事情來得到它的工作，大多與該元素的ID，你正在使用要做到：

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('.auto').autocomplete({ 
      source: "search.php", 

      ... 

      select: function(event, ui) { 

       // figure out which auto we're using and get it's 
       // associated hidden field... 
       var element_id = $(this).attr('id'); 
       var hidden_element_id = element_id + "_hidden"; 

       // set the appropriate fields' values... 
       $(this).val(ui.item.label); 
       $("#"+hidden_element_id).val(ui.item.value); 

       return false; 
      } 

      ... 

     }); 
    }); 

</script> 

<p>Type the name of a band: <input type="text" class="auto" id="auto1" /></p> 
<p>Type the name of a band: <input type="text" class="auto" id="auto2" /></p> 

<input name="hidden" id="auto1_hidden" type="hidden" /> 
<input name="hidden" id="auto2_hidden" type="hidden" /> 

其中一個更簡單的方法來隱藏字段關聯與可見的同行...你得到當前正在自動填充的元素的ID，然後通過將'_hidden'附加到它的ID屬性上來獲取它的隱藏字段對應物......有意義嗎？

不要忘記更改字段的ID屬性！希望這可以幫助！