Tôi đã kiểm tra các chủ đề khác, đề cập đến vấn đề này, nhưng không có giải pháp nào phù hợp với tôi.Select2 Chọn trong Bootstrap Modal
Tôi đang sử dụng jquery 1.11.2, select2-4.0.0-beta.3 và bootstrap-3.3.1
modal của tôi trông giống như sau:
<div class="modal fade" id="addProductModal">
<div class="modal-dialog">
<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">Add Product</h4>
</div>
<div class="modal-body">
{!! BootForm::openHorizontal(2,10)->action('/recipes/'.$recipe->id.'/product')->post() !!}
{!! BootForm::select('Produkte: ','product_list[]' , $products)->id('products') !!}
{!! BootForm::submit('Erstellen') !!}
{!! BootForm::token() !!}
{!! BootForm::close() !!}
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Schließen</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
Và tôi muốn gọi $('#products').select2();
Plugin hoạt động tốt ở những nơi khác. Nhưng nó hơi say lên trong một phương thức:
Cập nhật: (Không) fiddle Làm việc ở đây http://jsfiddle.net/Strernd/o0d3vtek/
Giải pháp 2 có vẻ tốt. Thật ngu ngốc khi sử dụng phiên bản beta. Nhưng bây giờ tôi có vấn đề này http://i.imgur.com/wAHIpKD.png – Strernd
Vì bạn đang sử dụng Bootstrap, bạn sẽ cần hai tệp CSS. 'Select2.css' và' select2-bootstrap.min phổ biến '.css' (xem tài nguyên fiddle). Để có thêm hiệu ứng "giống như Bootstrap", hãy xem trang này: https://fk.github.io/select2-bootstrap-css/ –
Cảm ơn bạn rất nhiều! Bạn đã tiết kiệm thời gian của tôi :) – Strernd