自动完成动态输入字段

时间:2014-10-27 20:40:52

标签: jquery ajax autocomplete

我看到像我这样的一堆话题,我经常测试,但我没有运气。 单击按钮,用户可以复制表单的ceartain部分,包括自动完成Ajax搜索。表单的这一部分是硬编码一次,搜索结果很好。 但克隆部分的搜索结果并不起作用。

我尝试为每个colned输入添加一个数字并在其上调用一个函数,但不知何故它不起作用。

这是自动填充功能

function autocomplete(actor_field) { 

$( actor_field ).autocomplete({

    minLenght:0,
    delay:0,

    source: function( request, response ) {
                  $.ajax({
                    url : 'path',
                    dataType: "json",
                    type: "POST",
                    data: {search: request.term,},

                    success: function( data ) {
                        response( $.map( data, function( item ) {
                            return {
                                label: item.first_name + ' ' + item.last_name,
                                value: item.actor_id
                            }
                        }));
                    }
                  });
              },

messages: {
    noResults: '',
    results: function() {}
},

open: function() { 
    $("ul.ui-menu").width( $(this).innerWidth() );
}

});
}

这是克隆功能

$( "#add_character" ).on("click", function(event){

event.preventDefault();

actor_id++;

var newDiv = $('#character_form').clone(true);
$(newDiv).find('#voice_actor').attr('id', 'voice_actor' + actor_id);
$(newDiv).appendTo('#character');

var actor_field = '#voice_actor' + actor_id;
alert (actor_field);

autocomplete(actor_field);

});

1 个答案:

答案 0 :(得分:0)

您需要将自动完成包装在jquery'on'方法中,以便事件将绑定到新的/克隆元素。

请参阅: http://api.jquery.com/on/