Question

我一直在尝试为系统开发一个界面，用户应该添加一些项目，包括各自的数量，序列号和观察结果。

因此，我会显示一个包含一行的表格，但点击按钮添加行，底部会添加另一行。

我在列中使用了Select2，以便用户可以在同一输入中添加多个序列号，并将其用作魅力。但是，当我单击按钮添加行时，将添加另一行，但该插件未启动。我认为它可能很简单，但我并没有真正使用jQuery。

希望你理解我的问题，伙计。

<script type="text/javascript"><!--adição e exclusão das linhas da tabela-->
$(document).ready(function(){
    var i=1;
    function Adicionar(){   
        $('#tab_logic tbody').append("<tr id='addr"+(i+1)+"'><td><select class='selectPretty form-control' placeholder='Descrição' name='material"+i+"' required><option></option><option value='Rádio VHF PRO 5150 Motorola'>Rádio VHF PRO 5150 Motorola</option><option value='Rádio VHF PRO 5100 Motorola'>Rádio VHF PRO 5100 Motorola</option><option value='Mesa de Som 4 canais Maxtor'>Mesa de Som 4 canais Maxtor</option><option value='Microfone sem fio Cantabem'>Microfone sem fio Cantabem</option></select></td><td><input  name='qtde"+i+"' type='number' placeholder='Qtde'  class='form-control'></td><td><select class='selectPretty form-control' name='serial"+i+"' multiple='multiple' placeholder='Serial'><option value='3859'>3859</option><option value='4568'>4568</option><option value='7741'>7741</option><option value='1259'>1259</option><option value='9965'>9965</option></select></td><td><input  name='obs"+i+"' type='text' placeholder='Observações'  class='form-control'></td> <td><button class='btn btn-sm btn-danger btnExcluir'><i class='glyphicon glyphicon-remove'></i></button></td></tr>");
        i++;
        $(".btnExcluir").bind("click", Excluir);
        $(".selectPretty").select2();
    };
        $("#addItem").bind("click", Adicionar);
    function Excluir(){
        var par = $(this).parent().parent(); //tr
        par.remove();
    };
    function Select(){
        $(".selectPretty").select2();
    };
    $(".btnExcluir").bind("click", Excluir);
});
</script>

Answer 1

我已经更新了jsbin中的一些代码

  $("#tab_logic").find("tbody tr").find("td:eq(0)").each(function(index,val){
          var name = $($(this).html()).prop('name');
        $(':input[name='+name+']').select2();
      });   

  $("#tab_logic").find("tbody tr").find("td:eq(2)").each(function(index,val){
          var name = $($(this).html()).prop('name');
        $(':input[name='+name+']').select2();
  });

JSBIN http://jsbin.com/wicutoti/17/edit

使用select2的多个实例

1 个答案: