我有select
标记:
<select id="categoryID" onchange="changeCategory(this)" class="form-control select2" style="width: 100%">
@foreach($category as $item)
<option id="{{$item->id}}">{{$item->name}}</option>;
@endforeach
</select>
<script>
function initialSelect() {
$(".select2").select2();
}
$(function () {
//Initialize Select2 Elements
$(".select2").select2();
});
</script>
然后在点击按钮时弹出此对话框时将其置于对话框中:
<button onclick="typeAdd()" class="btn btn-block btn-primary" data-toggle="modal"
data-target="#addNewCategoryModal">New
</button>
<div class="modal fade" id="addNewCategoryModal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
aria-hidden="true">×</span>
</button>
<h4 class="modal-title" id="titleLabel">New Category</h4>
</div>
<div class="modal-body">
<div class="form-group">
<select id="categoryID" onchange="changeCategory(this)" class="form-control select2" style="width: 100%">
@foreach($category as $item)
<option id="{{$item->id}}">{{$item->name}}</option>;
@endforeach
</select>
</div>
</div>
</div>
<script>
function initialSelect() {
$(".select2").select2();
}
$(function () {
//Initialize Select2 Elements
$(".select2").select2();
});
</script>
但是当弹出对话框时,select
标记会显示但不能输入(在input
标记中搜索)。
我认为原因是$(".select2").select2();
,因此我尝试在显示对话框时设置此行:
$('#addNewCategoryModal').on('show.bs.modal', function (event) {
var modal = $(this)
initialSelect();
modal.find('.modal-body #category_id').val(categoryID)
modal.find('.modal-body #type').val(type)
//this
modal.find('.modal-body #categoryID').select2();
modal.find('.modal-body categoryID').select2();
modal.find('.select2').select2();
$(".select2").select2();
})
它不起作用,请帮忙。感谢。