How to control the select box when I add new one?
You need to put
$('.selectpicker').selectpicker();
as last line of addColorOptions
method to initialize the newly added select.
As we are adding a
bootstrap-select
dynamically, we need to initialize them after creating them. You can find the documentation bootstrap-select here
when everything is working fine and just dynamically added select inputs not rendering as expected
function addColorOption() {
var color = `
<div class="form-group">
<select class="selectpicker" data-live-search="true" name="color_id" style="width:100%">
@foreach($colors as $color)
<option value="{{ $color->id }}">{{ $color->name }}</option>
@endforeach
</select>
</div>
`;
$('#products-color').append(color);
$('.selectpicker').selectpicker(); //just adding it here will do
}
``
Aucun commentaire