Reac-multiselect-dropdown-bootstrap
một phản ứng. js để dễ dàng tạo danh sách thả xuống cho phép lựa chọn nhiều tùy chọn
ví dụĐây là một ví dụ với cài đặt mặc định khi chỉ cung cấp một mảng có các tùy chọn
Cách cài đặt_______0_______Sau đó, bạn cần nhập nó và đặt ở đâu đó trong ứng dụng của mình. Đây là một ví dụ cho thiết lập mặc định
import React from "react"; import DropdownMultiselect from "react-multiselect-dropdown-bootstrap"; class SomeSection extends React.Component { render[] { return [ ]; } } export default SectionTwo;đạo cụ có sẵn
Yêu cầu
options
- một mảng với các tùy chọn có sẵnname
- một chuỗi có tên [giống như đối với đầu vào html thông thường]
Không bắt buộc
selected
- một mảng với các tùy chọn nên được chọn làm mặc địnhhandleOnChange
- chức năng gọi lại để chạy khi các tùy chọn đã chọn sẽ bị thay đổi. Một thông số "đã chọn" có sẵn. Nó chứa một loạt các tùy chọn hiện được chọn. Thí dụ
handleOnChange={[selected] => { props.changeMarket[selected]; }}
placeholder
- giá trị mặc định là "Không có gì được chọn"buttonClass
- bạn có thể chỉ định lớp css cho nút. Mặc định là "btn-light"placeholderMultipleChecked
- bạn có thể chỉ định một trình giữ chỗ sẽ được sử dụng nếu nhiều tùy chọn được chọn cùng một lúc. Ví dụ. "Nhiều lựa chọn"
Kích thước tập tin. 1. 68 MBLượt xem Tổng cộng. 659942Cập nhật lần cuối. 08/07/2021 01. 35. 00 UTC Ngày Xuất bản. 27/11/2013 12. 52. 39 UTCTrang web chính thức. Tới trang webGiấy phép. MIT
Tải xuống bản trình diễn
Thêm trong danh mục này
Xem các plugin được đề xuất
TOP 100 Plugin jQuery 2022
Chrome, IE8+, FireFox, Opera, Safari#Bootstrap#bootstrap 4#Checkbox#Multiple Select
popupContainer: '
', filter: '6. chức năng gọi lại
________số 8_______7. phương pháp API
// destroy the instance $['#demo'].multiselect['destroy']; // refresh the checked checkboxes based on the currently selected options $['#demo'].multiselect['refresh']; // rebuild the instance $['#demo'].multiselect['rebuild']; // select an option $['#demo'].multiselect['select', value]; // deselect an option $['#demo'].multiselect['deselect', value]; // select all options $['#demo'].multiselect['selectAll', justVisible]; // deselect all options $['#demo'].multiselect['deselectAll', justVisible]; // update the text and title of the button $['#demo'].multiselect['updateButtonText']; // update options $['#demo'].multiselect['setOptions', options]; // enable/disable the multiselect $['#demo'].multiselect['disable']; $['#demo'].multiselect['enable']; /* provide options programmatically var data = [ {label: 'Option 1', title: 'Option 1', value: '1', selected: true}, {label: 'Option 2', title: 'Option 2', value: '2'}, {label: 'Option 3', title: 'Option 3', value: '3', selected: true} ]; */ $['#demo'].multiselect['dataprovider', data]; // programmatically provide a new text to display in the button when all options are selected, at runtime $['#demo'].multiselect['setAllSelectedText', value];
Nhật ký thay đổi
v1. 1. 1 [2021-08-07]
- Tùy chọn nút đặt lại
- onSelectAll và onDeselectAll nhận các tùy chọn đã thay đổi làm đối số
- Hỗ trợ bàn phím cố định
- Đã sửa lỗi thông số kỹ thuật của Bower và NPM, đặc biệt liên quan đến phiên bản Bootstrap và thông tin meta
v1. 1. 0 [2021-07-30]
- Thiết kế lại bộ lọc và các mục hoạt động
- Đã thêm tùy chọn mới "widthSynchronizationMode"
- Đã thêm tùy chọn mới "buttonTextAlignment"
- Đã sửa lỗi
2020-12-22
- Sửa chiều rộng chọn
v1. 0. 0 [2020-11-18]
- Đã cập nhật cho Bootstrap 4
2020-11-01
- v0. 9. 16
2018-03-04
- v0. 9. 15
2018-01-03
- vá lỗi
2017-12-18
- vá lỗi
2016-08-18
- v0. 9. 13
2016-07-30
- đã sửa. bỏ chọn/chọn không hoạt động với tìm kiếm khi giá trị được nhập vào tìm kiếm
2016-07-29
- Thêm trình giữ chỗ dữ liệu thu gọn nhiều lựa chọn
23-07-2016
- Đã sửa các sự cố khác với enableCollapsibleOptGroups
2016-04-23
- Cho phép tên hộp kiểm khác nhau cho cùng một danh sách thả xuống
21-04-2016
- đã sửa lỗi chọn tất cả + có thể nhấp + có thể thu gọn
2016-04-20
- vá lỗi
2016-04-18
- Một số bản sửa lỗi và nhiều thử nghiệm khác cho các nhóm tùy chọn có thể nhấp và có thể thu gọn
v0. 9. 13 [15-10-2015]
- vá lỗi
2015-05-27
- Đã thêm tùy chọn để thu gọn các nhóm [một số loại menu phụ]
- onChange được kích hoạt riêng cho từng tùy chọn [đã bỏ] được chọn
2015-04-12
- sửa lỗi
2015-03-18
- v0. 9. 12
2015-03-01
- cập nhật
2015-02-17
- cập nhật
2015-02-14
- Thêm tùy chọn onSelectAll
2015-02-13
- Hỗ trợ bộ lọc với các nhóm lựa chọn có thể nhấp
2014-11-02
- đã khắc phục sự cố
2014-10-13
- đã khắc phục sự cố
2014-08-08
- sửa lỗi cho IE 8
2014-08-03
- Cải thiện hiệu suất bộ lọc
- Thêm chức năng onDropdownShown gọi lại
2014-07-15
- Cập nhật
2014-05-24
- Cập nhật
2014-04-02
- Đã cập nhật bật, tắt demo
2014-04-01
- các mẫu có thể được ghi đè bằng các tùy chọn cấu hình
2014-03-31
- cập nhật
2014-03-13
- Bootstrap 3. 1. 1 bản cập nhật
- Đã sửa lỗi
2014-03-12
- Bootstrap 3. 1. 1 bản cập nhật
- Đã sửa lỗi
2014-02-07
- sửa lỗi
2014-01-09
- Đã sửa lỗi Khi tất cả các tùy chọn bắt đầu là đã chọn = 'đã chọn', hộp kiểm chọn tất cả không được chọn
2013-12-10
- Đã sửa lỗi khi không có ràng buộc tùy chọn nào được đưa ra
Plugin jQuery tuyệt vời này được phát triển bởi davidstutz. Để biết thêm Cách sử dụng nâng cao, vui lòng kiểm tra trang demo hoặc truy cập trang web chính thức