Tôi hiện có 2 lần thả xuống đa chọn trên một trang, một cái được gọi là 'Hazards' và 'HP_Codes' khác. Cả hai đều đưa ra danh sách của họ từ SQL DB và ý tưởng là 'HP_Codes' sẽ được đưa ra dựa trên những gì được chọn trong 'mối nguy hiểm'.
Nội dung chính ShowShow
- Bootstrap Multiselect - Ví dụ miễn phí, Mẫu & Hướng dẫn
- Ví dụ cơ bản
- Multisective với nhãn
- Multisective với trình giữ chỗ
- Multiselect bị vô hiệu hóa
- Tùy chọn vô hiệu hóa
- Nút rõ ràng
- Nội dung tùy chỉnh
- Các tùy chọn có thể nhìn thấy
- Văn bản thứ cấp
- Tìm kiếm
- Chọn với tìm kiếm bên trong một phương thức
- Nhóm tùy chọn
- Multisective với các biểu tượng
- Thẩm định
Vì vậy, theo lý thuyết, ai đó có thể chọn Hazard1, Hazard2 và Hazard3 và sau đó danh sách thứ hai sẽ tạo ra các tùy chọn liên quan đến 3 Hazard đó [một số tùy chọn có thể giống nhau - các bản sao được xóa].
Tôi là một người mới về điều này, do đó ném một mạng, vì vậy tôi bất kỳ đề xuất nào được đánh giá cao.
Cho đến nay, tôi đã thử giải pháp cho câu hỏi này [Bootstrap MultiSelect Tùy chọn động dựa trên thả xuống đầu tiên] nhưng tôi đã nhập tất cả các tùy chọn để dừng trang rút HP_Codes từ DB. Có khả năng giữ chúng Được rút ra từ DB sẽ thực sự hữu ích cho các bản cập nhật trong tương lai từ quan điểm trang bảo trì.
Điều gì sẽ là cách tốt nhất để đạt được điều này?
Chỉnh sửa ở đây là một đoạn của những gì hiện đang nằm trong mẫu của tôi. Để kéo dữ liệu vào MultiSelect từ DB Here is a snippet of what currently sits in my form. To pull the data in to the multiselect from the DB Here is a snippet of what currently sits in my form. To pull the data in to the multiselect from the DB
// Method to bind Dropdown
function fill_hazards_select_box[$con]
{
$output = '';
$query=mysqli_query[$con,"SELECT hazards FROM Chemilist_states"];
$cnt=1;
while[$row=mysqli_fetch_array[$query]]
{
$output .= " $row[0] ";
}
return $output;
}
function fill_hp_codes_select_box[$con]
{
$output = '';
$query=mysqli_query[$con,"SELECT hp_codes FROM Chemilist_hazards"];
$cnt=1;
while[$row=mysqli_fetch_array[$query]]
{
$output .= " $row[0] ";
}
return $output;
}
$month = date['m'];
$day = date['d'];
$year = date['Y'];
$today = $year . '-' . $month . '-' . $day;
?>
Sau đó để khởi tạo các plugin
$[document].ready[function[] {
$['#hazards'].multiselect[{
maxHeight: 300,
buttonWidth: '505px',
dropRight: true,
nonSelectedText: 'Select Hazard Statement[s]',
includeResetOption: true,
includeResetDivider: true,
enableFiltering: true,
includeFilterClearBtn: true,
enableCaseInsensitiveFiltering: true,
}];
}];
$[document].ready[function[] {
$['#hp_codes'].multiselect[{
maxHeight: 300,
buttonWidth: '505px',
dropRight: true,
nonSelectedText: 'Select Hazard Properties',
includeResetOption: true,
includeResetDivider: true,
enableFiltering: true,
includeFilterClearBtn: true,
enableCaseInsensitiveFiltering: true,
}];
}];
và cuối cùng để đặt mutliselect trong biểu mẫu
Hazard Statements: *
Hazard Properties: *
Bootstrap Multiselect - Ví dụ miễn phí, Mẫu & Hướng dẫn
Ph đa phản ứng đáp ứng được xây dựng với bootstrap 5. Ví dụ về thả xuống đa chọn với hộp kiểm, hộp sách, tìm kiếm, nút, nhóm, biểu tượng, xác thực, bị vô hiệu hóa
Không giống như một lựa chọn tiêu chuẩn, MultiSelect cho phép người dùng chọn nhiều tùy chọn cùng một lúc.
Lưu ý: Để tìm hiểu thêm về chọn thành phần chọn và xem tất cả các tùy chọn, phương thức, sự kiện và cách sử dụng nâng cao có sẵn - đọc phần chọn tài liệu & API To learn more about Select component and see all available options, methods, events and advanced usage - read Select Docs & API section To learn more about Select component and see all available options, methods, events and advanced usage - read Select Docs & API section
Ví dụ cơ bản
Multisective với nhãn
Multisective với trình giữ chỗ This component requires MDBootstrap Pro package.
Multisective với nhãn
Multisective với trình giữ chỗ
Multisective với trình giữ chỗ
Multiselect bị vô hiệu hóa
Multiselect bị vô hiệu hóa
Tùy chọn vô hiệu hóa
Tùy chọn vô hiệu hóa
Nút rõ ràng
Nút rõ ràng
Nội dung tùy chỉnh
Các tùy chọn có thể nhìn thấyNội dung tùy chỉnh
Các tùy chọn có thể nhìn thấy
Các tùy chọn có thể nhìn thấy
Văn bản thứ cấp
Tìm kiếmVăn bản thứ cấp
Tìm kiếm
Chọn với tìm kiếm bên trong một phương thứcTìm kiếm
Chọn với tìm kiếm bên trong một phương thức
Nhóm tùy chọnChọn với tìm kiếm bên trong một phương thức
Nhóm tùy chọn
Multisective với các biểu tượngNhóm tùy chọn
Multisective với các biểu tượng
$[document].ready[function[] {
$['#hazards'].multiselect[{
maxHeight: 300,
buttonWidth: '505px',
dropRight: true,
nonSelectedText: 'Select Hazard Statement[s]',
includeResetOption: true,
includeResetDivider: true,
enableFiltering: true,
includeFilterClearBtn: true,
enableCaseInsensitiveFiltering: true,
}];
}];
$[document].ready[function[] {
$['#hp_codes'].multiselect[{
maxHeight: 300,
buttonWidth: '505px',
dropRight: true,
nonSelectedText: 'Select Hazard Properties',
includeResetOption: true,
includeResetDivider: true,
enableFiltering: true,
includeFilterClearBtn: true,
enableCaseInsensitiveFiltering: true,
}];
}];
9.Multisective với các biểu tượng
Thẩm định
Vì vậy, theo lý thuyết, ai đó có thể chọn Hazard1, Hazard2 và Hazard3 và sau đó danh sách thứ hai sẽ tạo ra các tùy chọn liên quan đến 3 Hazard đó [một số tùy chọn có thể giống nhau - các bản sao được xóa].Thẩm định
Vì vậy, theo lý thuyết, ai đó có thể chọn Hazard1, Hazard2 và Hazard3 và sau đó danh sách thứ hai sẽ tạo ra các tùy chọn liên quan đến 3 Hazard đó [một số tùy chọn có thể giống nhau - các bản sao được xóa].
Tôi là một người mới về điều này, do đó ném một mạng, vì vậy tôi bất kỳ đề xuất nào được đánh giá cao.