jquery livequeryは自動応募を修正していませんか？

Question

ここでは、注文商品アイテムの項目の自動検索機能を有効にしています：

ここで問題となるのは、新しい検索商品フィールド（注文アイテムのタイトルの下に緑色のボタン）を追加すると、自動候補プラグインが機能しません新しいフィールド。私が読んだいくつかの記事から、私はautosuggestがこの問題を修正すると思ったが、修正していないと思った。どんな考え？

自動提案：

$("#PRODUCTNAME").autocomplete("orders.cs.asp?Process=ListProducts", { 
    selectFirst: false 
}); 

$("#PRODUCTNAME").result(function(event, data, formatted) { 
    if (data) 
     $("#PRICE").html(data[1]); 
     $("#ID").html(data[2]); 
     $("#UNITPRICE").html(data[1]); 
     $("#PRODUCTID").html(data[2]); 
}); 

は、新しいフィールドを追加すること

$('#AddProduct').livequery('click', function(event) { 
    $('#OrderProducts').append('<div class="column width50"><input type="text" id="PRODUCTNAME" name="PRODUCTNAME" value="" class="width98" /><input type="hidden" id="PRODUCTID" name="PRODUCTID" /><input type="hidden" id="UNITPRICE" name="UNITPRICE" /><small>Search Productsvalue="" class="width98" /><small>Quantity</small></div><div class="column width30"><span class="prices">Unit Price:<br />Total Price:</span></div>'); 
    return false; 

}）;

HTML

 <fieldset> 
      <h2>Order Items</h2> 
      <div id="OrderProducts"> 
       <a href="#" id="AddProduct"><img src="icons/add.png" alt="Add" /></a><a href="#" id="DeleteProduct"><img src="icons/cancel.png" alt="Cancel" /></a> 
      </div> 

       <input type="hidden" id="PRODUCTID" name="PRODUCTID" /> 
       <input type="hidden" id="UNITPRICE" name="UNITPRICE" /> 
       <small>Search Products</small> 
      </div> 
      <div class="column width20"> 
       <input type="text" id="UNITPRICE" name="UNITPRICE" value="" class="width98" /> 
       <small>Quantity</small> 
      </div> 
      <div class="column width30"> 
       <span class="prices">Unit Price:<br />Total Price:</span> 
      </div> 
     </fieldset> 
}); 

Answer 1

私はこの問題は、あなたが新しい要素に自動補完を追加していないということです数えます。あなたは実際にライブクエリーを必要としません。したがって、そのようなコードのあなたの第二のブロックを変更：

$('#AddProduct').click(function() { 
     var adding = $('<div class="column width50"><input type="text" id="PRODUCTNAME" name="PRODUCTNAME" value="" class="width98" /><input type="hidden" id="PRODUCTID" name="PRODUCTID" /><input type="hidden" id="UNITPRICE" name="UNITPRICE" /><small>Search Products</small></div><div class="column width20"><input type="text" id="UNITPRICE" name="UNITPRICE" value="" class="width98" /><small>Quantity</small></div><div class="column width30"><span class="prices">Unit Price:<br />Total Price:</span></div>');   
     $('#OrderProducts').append(adding); 

     adding.find("#PRODUCTNAME").autocomplete("orders.cs.asp?Process=ListProducts", { 
      selectFirst: false 
     }).result(function(event, data, formatted) { 
      if (data) { 
       adding.find("#PRICE").val(data[1]); 
       adding.find("#ID").val(data[2]); 
       adding.find("#UNITPRICE").val(data[1]); 
       adding.find("#PRODUCTID").val(data[2]); 
      } 
     }); 

     return false; 
}); 

私はここにある一つまたは二つの小さな微調整がなければ、それを行う必要があります数えます。

方法によってフォーム要素をどのように処理しているかについてのちょうど2つのコメント - あなたのメソッドは同じIDを持つ複数の要素をもたらしますが無効です（動作しますが）代わりに。次に、html関数を使って入力の値を設定しました。私の提案するソリューションでは、htmlの呼び出しをvalに置き換えました。