Jak stworzyć dynamiczny Bootstrap wielokrotny

Question

Próbuję użyć Bootstrap wielokrotny używałem następujący kod

html

<input type="text" id="addRow"/> 
<input type="button" id="btn" value="Add"/> 
<form id="form1"> 
    <div style="padding:20px"> 
    <select id="chkveg" multiple="multiple"> 
    </select> 
    </div> 
</form> 

i skrypt

$(function() { 
    $('#btn').click(function() { 
     var val = $("#addRow").val(); 
     var htm = ''; 
     htm += '<option>' + val + '</option>'; 
     $('#chkveg').append(htm); 
    }); 
    $('#chkveg').multiselect({ 
     includeSelectAllOption: true 
    }); 
}); 

jestem starają się dodać każdy opcja dynamicznie do multiselektru programu startowego, ale nie działa prawidłowo

Demo pag e tutaj: http://jsfiddle.net/pL4hg76b/1/

Ale jego pracy statycznie: http://jsfiddle.net/KyleMit/7yq7fvsq/

Answer 1

Można append lista załadowania ul i Aplikacje select

$('.multiselect-container').append(htm); 
$('#chkveg').append(htm); 

tutaj jest nowy Demo: http://jsfiddle.net/pL4hg76b/2/

Answer 2

Musisz użyj .multiselect('rebuild') metody multiselect po użyciu .append()

$('#chkveg').multiselect('rebuild'); 

Updated Fiddle

---

Pełny kod

$(function() { 
    $('#btn').click(function() { 
     var val = $("#addRow").val(); 
     var htm = ''; 
     htm += '<option>' + val + '</option>'; 
     $('#chkveg').append(htm); 
     $('#chkveg').multiselect('rebuild'); 
    }); 
    $('#chkveg').multiselect({ 
     includeSelectAllOption: true 
    }); 
}); 

Answer 3

Trzeba dodać

$('#chkveg').multiselect('rebuild'); 

na końcu zdarzenia kliknięcia przycisku, aby odbudować multiselekcję.