jquery動態添加行上的自動完成

Question

我正在爲我的web應用程序使用jQuery UI自動完成插件。
它對我現有的行非常適用，但對於我的動態添加行不太適用。

這是我的jQuery代碼。

$(function() 
{ 
    var tab = $("#tabs-6"); 
tab.find("input[name='newContactName']").autocomplete(
{ 
     source: function(request, response) { 
      var cachedRequest = $(this).data("cachedRequest"); 
      // Previous data is cached, so new data is a subset of this 
      if (cachedRequest != null && 
        cachedRequest.length > 0 && 
        request.term.indexOf(cachedRequest) >= 0) 
      { 
       ..some code.. 
      } 
      else 
      { 
       var input = $(this); 
       $.ajax({ 
        ..some code.. 
        success: function(data) 
        {..some code.. 
        } 

       }); 

      } 
     }, 
     minLength: 3, 
     delay: 500 
    } 
); 

tab.find("input[name='newContactName']").bind('autocompleteselect', function(event, ui) { 
    $(this).prev("input[name='newContactId']").val(ui.item.person_id); 
    }); 

/* Customizing the autocomplete suggestions box that pops up. 
*/ 
var input1=$("input[name='newContactName']"); 
input1.each(function(){ 
$(this).autocomplete("widget").css("height", "10em"); 
$(this).autocomplete("widget").css("overflow", "auto"); 
$(this).autocomplete("widget").css("width", "210px"); 
}); 

}）;

這是自動完成插件的現有行jQuery代碼，併爲新添加的行，這是我試圖插入

var html = '<tr>..first 8 td elements.. <td><input type="text" name="newContactName"> </td>'+ 
     ..some more td elements</tr>'; 

var newRow = $(html).insertAfter(row); // insert content,where row is my current row 
newRow.find("td:nth-child(9) input[name='newContact']").autocomplete(); 

的HTML我將如何確保自動完成功能適用於我新添加的行以及？

Answer 1

我看到一些可能是錯誤的東西。

首先，當您添加新行時，您將輸入的名稱設置爲「newContactName」，但是當您查找（）時，您會查找「name ='newContact'」。

此外，在find（）的結果上調用autocomplete（）時，您需要指定source選項。由於您的源設置爲非動態行中的函數，因此您可能需要將其分解爲命名函數，並在兩次autocomplete（）調用中使用指定函數作爲源。

希望這有助於...