I'm trying to use Select2
in dynamic form (add new row using jQuery clone), but apparently the cloned row doesn't pertain the functionality of Select2
. Got the error
The 2nd select menu created but it generated error:
Uncaught TypeError: $(...).select2 is not a function
I'm using this HTML part:
<tbody id="treatmentlist">
<tr class="itemData">
<td>
{{Form::select('treatments[]',$treatments, null, ['class' => 'form-control treatment', 'placeholder' => 'Select treatment' ])}}
</td>
<td><i class="fas fa-plus-circle" id='addRow'><i class="fas fa-minus-circle" id="delRow"></i></td>
</tr>
</tbody>
And here is the script part:
@section('scripts')
<script>
$(".treatment").select2();
$("#addRow").on('click', function (e) {
e.preventDefault();
var $tr = $(this).closest('.itemData');
var $clone = $tr.clone();
$tr.after($clone);
$(".treatment").select2();
});
</script>
@endsection
Already try to add select2('destroy')
without no luck.
Any suggestion how to make the newly cloned row keep the Select2 functionality?