使用select2的多個實例

我一直在試圖爲系統開發一個接口，用戶應該在其中添加一些項目以及它們各自的數量，序列號和觀測值。使用select2的多個實例

所以，我要顯示一個單行的表，但點擊一個按鈕添加行，另一行添加在底部。

我在列中使用了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>

來源

2014-04-10 fdiasmil

安裝Firebug的或看到的東西控制檯，並檢查是否有當您添加一個新行的錯誤。 –

你能向我們展示一個關於jsFiddle的例子嗎？ –

好友，我無法上傳我的例子上jsFiddle，但我上傳到我的服務器在互聯網上，你可以檢查它點擊下面的鏈接： [http：//.f59.com.br/ccom/ criar-cautela.php]（http://www.f59.com.br/ccom/criar-cautela.php） – fdiasmil

我hvae在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

來源

2014-04-28 14:42:04 holmes2136

親愛的@ holmes2136，我很想感謝你的幫助，對我來說非常有用，它的功能就像一個魅力它花了我一些時間讓它工作，但它是因爲我試圖把我的代碼和你的代碼混合起來，當我只使用你的代碼時，它就起作用了，然後我添加了一些代碼對於答案的延遲，我很抱歉，但我正在忙於另一個項目的工作感謝大家誰也試圖幫助我。 – fdiasmil

使用select2的多個實例

回答

相關問題