Javascript在重复行上不起作用

时间:2015-08-04 18:50:11

标签: javascript jquery

我有一个带有表单字段元素的表格行,当我按下加号图标时,它会复制。在同一行上,表单字段元素是由javascript控制的自动完成字段。自动完成功能在初始行上有效,但是一旦按下加号图标,它就无法在新行上运行。我尝试将#nameSearch更改为.nameSearch和ID分别在表单元素上更改,但是没有用。我如何让javascript在新行上运行?

HTML表单元素

<tr><td>
<input type='search' id='nameSearch' name='vote[]' placeholder='Search User'/>
<a href="#" id="addRow">+</a>
</td></tr>

JAVASCRIPT FOR AUTOCOMPLETE

<script>
$(document).ready(function(){

$('#nameSearch').autocomplete({

source:'results.php', 
minLength:1,
select: function(event, ui){

  // just in case you want to see the ID
  var accountVal = ui.item.value;
  console.log(accountVal);

  // now set the label in the textbox
  var accountText = ui.item.label;
  $('#nameSearch').val(accountText);

  // now set the label in the textbox
  var accountText = ui.item.value;
  $('#nameSearchID').val(accountText);

  return false;
},
focus: function( event, ui ) {
  // this is to prevent showing an ID in the textbox instead of name 
  // when the user tries to select using the up/down arrow of his keyboard
  $( "#nameSearch" ).val( ui.item.label );
  return false;  
},  

});

});
</script>

JAVASCRIPT FOR NEW ROW

$(window).load(function(){
$(function() {
    var scntDiv = $('#p_row');
    var i = $('#p_row tr').size() + 1;

    $('#addRow').live('click', function() {
            $('<tr><td><input type='search' id='nameSearch' name='vote[]' placeholder='Search User'/><a href="#" id="remRow">-</a></td></tr>').appendTo(scntDiv);
            i++;
            return false;
    });

    $('#remRow').live('click', function() { 
            if( i > 1 ) {
                    $(this).parents('tr').remove();
                    i--;
            }
            return false;
    });
});

});

所以问题在于获取生成的表的第二行以使自动完成工作。

任何帮助都将不胜感激。

0 个答案:

没有答案