使用 select2 的多个实例

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