2017-11-07 18 views
0

JQuery Autocompete renderItemに問題があります。私のオートコンプリートは正常に動作しますが、データが受信された後には.data("ui-autocomplete")._renderItemが呼び出されていないようです。スクリプトを実行してもエラーは発生しません。私はconsole.log("success");にしようとしましたが、どちらも実行されません。私は何か不足していますか? jquery-uiのバージョンは1.12.1です。どんな助けでも大歓迎です!JQueryオートコンプリートrenderItemが動作しないv。1.12.1

HTML:

<td class="itemCodeHd"><input class="itemCode" name="ItemCode[]" <?php echo "value='$ItemCode'"?> <?php echo "id= ItemCodeItem" . $l;?> ></td> 
<td class="itemDescriptionSalesHd"><textarea class="itemDescriptionSales" name="ItemDescriptionSales[]" <?php echo "id= ItemDescriptionSalesItem" . $l;?> rows="1" tabindex="2"><?php echo "$ItemDescriptionSales"?></textarea></td> 

JSON:

[{"itemCode":"001","itemDescriptionSales":"Item 1"}, 
{"itemCode":"002","itemDescriptionSales":"Item 2"}, 
{"itemCode":"003","itemDescriptionSales":"Item 1"}] 

のjQuery:

$(function() { 


$(".itemCode").autocomplete({ 
    source: function(request, response) { 
    $.ajax({ 
     url: "item-search.php", 
     dataType: "json", 
     data: { 
     term: request.term 
     }, 
     success: function(data) { 
     response(data); 
     } 
    }); 
}, 
minLength: 3, 
    select: function(event, ui) { 
     $(this).parent().siblings().children(".itemDescriptionSales").val(ui.item.itemDescriptionSales); 

    }  

}).data("ui-autocomplete")._renderItem = function (ul, item) { 
    console.log("success"); 
      return $('<li>') 
      .data("ui-autocomplete-item", item) 
      .append("<a>" + item.itemCode + "<br>" + item.itemDescriptionSales + "</a>") 
      .appendTo(ul); 


     }; 

    }); 
+0

追加できるhtmlは何ですか? –

+0

@DerekNolan HTMLとJSONの出力を追加しました。 – Luke

答えて

1

わかりました。私は実際にはPHPなしでこれをテストすることはできませんが、私は起こっていると思いますconsole.log()は別の機能にあるので、全く発砲していないコードを置くことです。このコードをajax呼び出しの成功関数に移動してみてください。私が以下で行ったことに似た何か。警告...テストされていないコードが先です!

$(function() { 


$(".itemCode").autocomplete({ 
    source: function(request, response) { 
    $.ajax({ 
     url: "item-search.php", 
     dataType: "json", 
     data: { 
     term: request.term 
     }, 
     success: function(data) { 
     response(data).data("ui-autocomplete")._renderItem = function (ul, item) { 
      console.log("success"); 
      return $('<li>') 
      .data("ui-autocomplete-item", item) 
      .append("<a>" + item.itemCode + "<br>" + item.itemDescriptionSales + "</a>") 
      .appendTo(ul); 
     }; 
     } 
    }); 
}, 
minLength: 3, 
    select: function(event, ui) { 
     $(this).parent().siblings().children(".itemDescriptionSales").val(ui.item.itemDescriptionSales); 

    }  

}) 

}); 
関連する問題