Question

我正在使用typeahead.js

我有一个带有两个输入的行表，（代码和乘积）后者输入为typeahead，一旦我选择了typeahead选项，它也会填充代码输入。

这两个输入最初在页面上加载。然后，根据用户的请求，通过单击一个按钮添加其他行，该行将添加一个具有相同的两个输入（不同名称）的新行。

我有一个JS var（数字= 0）来控制添加的动态输入，它在单击添加行按钮时递增，并且每次单击添加行按钮时都会调用typeahead函数。

HTML代码：

<td>
   <input type="text" name="code_product_0" id="code_product_0">                                                     
</td>                                                                            
<td>                                                                                 
   <input type="text" name="product_0" id="product_0">
</td>

<a class="btn" href='javascript:addRow(); typeahead();' id="btn-new-product"> Add Product</a>

这是addRow代码：

function addRow() {

number++; 
$('#table').append(
   "<tr>" +
       "<td><input name='code_product_"+number+"' id='code_product_"+number+"' type='text' class='form-control'></td>" +
       "<td><input class='typeahead form-control' type='text' name='product_"+number+"' id='product_"+number+"'></td>" +
   "</tr>");
}

这是预输入代码：

$('#product_'+number).typeahead(null, {
      name: '#product_'+number,
      displayKey: 'name',
      source: custom.ttAdapter()
    }).on('typeahead:selected', function(event, data){            
        $('#product_'+number).val(data.name);
        $('#code_product_'+number).val(data.code);
    });

这里的问题是，当我有2行或更多行时，无论我要更改的哪一项产品输入（最后一行除外），产品输入都会正确更改，但会填充最后一行的代码输入，而不是我所输入的改变

如何使用预输入处理动态输入？

0 个答案: