php Jquery Ajax自动完成动态添加的文本框答案

【问题标题】：php Jquery Ajax autocomplete for dynamicaly added textboxphp Jquery Ajax自动完成动态添加的文本框
【发布时间】：2016-03-30 12:01:49
【问题描述】：

我有一个网络表单，其中表的每一行中的一个字段都有一个 Jquery AutoComplete 函数，这很好用。我还使用 ajax 调用动态地将行添加到该表中。问题是我似乎无法让自动完成功能在动态添加的行（文本框）上工作。基于谷歌“所有”我需要做的就是将 .autocomplete 添加到添加的字段中。我尝试了不同的变体，似乎 jquery 找不到要添加的字段？

添加行代码：

$(".btnAddRow").click(function(){
var count = $(this).closest('.AgensDiv').children('.count').val();
var tab = $(this).closest('tr').find('.tab').val();

count++;

$.ajax({
    url: "tblRow.php", 
    type: "POST",
    dataType: "HTML",
    data: {"count": count,
        "tab": tab},
    success: function(result){
        //console.log(result);  
        $("#agensTbl tr:last").before(result);

    }});    
$(this).closest('.AgensDiv').children('.count').val(count);             
});

自动完成代码：

$(".legemiddel" ).autocomplete({
source: function( request, response ) {
    $.ajax({
        url: "AgensSok.php",
        type: "POST",
        dataType: "json",
        data: {"Virkestoff": request.term},
        success: function(data){
            response(data);
            //console.log(data);
        },
        error: function(error){
             console.log("Error:");
             console.log(error);
        }
    });
},
minLength: 3,
select: function( event, ui ) {
    $(this).closest('tr').find('.atc').val(ui.item.id);
    //$("#testAjax").val(ui.item.id);
 },
 open: function() {
   $( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" );
 },
 close: function() {
   $( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" );
 }
});

尝试了添加自动完成功能或仅更改新添加行中文本框的值的不同变体

$("#agensTbl tr:last").prev().find(".legemiddel").val("popp");

改变新添加的on和之前行的值

$("#agensTbl tr:last").find(".legemiddel").val("popp");

不起作用 haw 尝试添加自动完成代码，但我猜问题是访问新添加的行。还尝试为新文本框提供唯一 ID 以进行测试。没有成功。

那么如何访问添加的行成员？或者有没有办法将自动完成添加到更高级别？ (document.body) 所有我希望在“legemiddel”类上使用 autoComplete 的文本框

【问题讨论】：

标签： php jquery ajax autocomplete

【解决方案1】：

所以我将自动完成代码更改为以下代码，这似乎可行。

$(document).on("keydown.autocomplete", ".legemiddel", function(e){
$(this).autocomplete({
source: function( request, response ) {
    $.ajax({
        url: "AgensSok.php",
        type: "POST",
        dataType: "json",
        data: {"Virkestoff": request.term},
        success: function(data){
            response(data);
            //console.log(data);
        },
        error: function(error){
             console.log("Error:");
             console.log(error);
        }
    });
},
minLength: 3,
select: function( event, ui ) {
    $(this).closest('tr').find('.atc').val(ui.item.id);
    //$("#testAjax").val(ui.item.id);
},
open: function() {
  $( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" );
},
close: function() {
  $( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" );
}
});
});

【讨论】：