Question

请看一下这个屏幕截图。

http://www.screencast.com/t/GMGBy6QF9bP

正如我所示，我试图在动态生成的字段上使用jquery ui自动完成功能，自动完成功能可以正常使用我正在使用的主要字段来复制＆amp;生成动态字段。但是当添加一个新字段时，自动完成功能不能与新生成的字段一起使用。

这是我的自动填充代码

$(function(){
  $(".get-tasks").autocomplete({
   source: baseurl+"job/job/get_tasks_autocomp",
  });
})

我想从这里得到一些人的帮助来解决这个问题，请在Code中显示我该如何解决这个问题。

这是添加新字段的代码

 $(document).ready(function(){  
      var i=0;  
      $('#add_fault_fld').click(function(){  
           i++;  
           $('#dynamic_field').append('<tr id="row'+i+'"><td><input type="text" class="get-tasks job-tasks form-control" name="fault['+i+']" id="['+i+']" placeholder="" class="form-control name_list" /></td><td><button type="button" name="remove" id="'+i+'" class="btn btn-danger btn_remove">X</button></td></tr>');

      });  
      $(document).on('click', '.btn_remove', function(){  
           var button_id = $(this).attr("id");   
           $('#row'+button_id+'').remove();  
      });  
      $('#submit').click(function(){            
           $.ajax({  
                //url:"name.php",  
                method:"POST",  
                data:$('#add_fault').serialize(),  
                success:function(data)  
                {  
                     alert(data);  
                     $('#add_fault')[0].reset();  
                }  
           });  
      });  



 }); //End

Answer 1

嗯，好的尝试一下，看看它是否适合你。我正在使用原型将自动完成功能附加到动态元素。

更新：为演示添加了jsfiddle：https://jsfiddle.net/p7pdmbgf/

UPDATED-2 ：https://jsfiddle.net/p7pdmbgf/3/

$('#add_fault_fld').click(function(){  
   i++;
   var element = '<tr id="row'+i+'"><td><input type="text" class="get-tasks job-tasks form-control" name="fault['+i+']" id="['+i+']" placeholder="" class="form-control name_list" /></td><td><button type="button" name="remove" id="'+i+'" class="btn btn-danger btn_remove">X</button></td></tr>';
   $('#dynamic_field').append(element).attachAutocomplete();
});


$.fn.attachAutocomplete = function() {
   $(this).find(".get-tasks").autocomplete({
     source: baseurl+"job/job/get_tasks_autocomp",
   });
}

Answer 2

@kasperite对不起这里发生的事情

我已经改变了

$.fn.attachAutocomplete = function() {
   $(this).find(".get-tasks").autocomplete({
     source: baseurl+"job/job/get_tasks_autocomp",
   });
}

到

  $.fn.attachAutocomplete = function() {
       $('#dynamic_field').attachAutocomplete({
         source: baseurl+"job/job/get_tasks_autocomp",
       });
    }

请问最新的代码是否有新的更新。

动态字段上的Jquery UI自动完成

2 个答案: