Phương thức lọc mảng trong API DataTables là gì?

Chức năng tìm kiếm do DataTables cung cấp rất hữu ích để tìm kiếm nhanh qua thông tin trong bảng - tuy nhiên, tìm kiếm là toàn cục và bạn có thể muốn trình bày các điều khiển để chỉ tìm kiếm trên các cột cụ thể

DataTables có khả năng áp dụng tìm kiếm cho một cột cụ thể thông qua phương thức column[].search[]DT [lưu ý rằng tên của phương thức là search chứ không phải filter vì filter[]DT được sử dụng để áp dụng bộ lọc cho tập hợp kết quả]

Các tìm kiếm cột được tích lũy, vì vậy bạn có thể áp dụng nhiều tìm kiếm cột riêng lẻ, ngoài tìm kiếm toàn cầu, cho phép hiển thị các tùy chọn tìm kiếm phức tạp cho người dùng

Ví dụ này cho thấy các thành phần văn bản đang được sử dụng với phương pháp column[].search[]DT để thêm các điều khiển đầu vào ở chân trang của bảng cho mỗi cột. Lưu ý rằng tùy chọn *index*:visible được sử dụng cho bộ chọn cột để đảm bảo rằng phương pháp column[]DT tính đến bất kỳ cột ẩn nào khi chọn cột để thực hiện

NamePositionOfficeAgeStart dateSalaryNamePositionOfficeAgeStart dateSalaryTiger NixonSystem ArchitectEdinburgh612011/04/25$320,800Garrett WintersAccountantTokyo632011/07/25$170,750Ashton CoxJunior Technical AuthorSan Francisco662009/01/12$86,000Cedric KellySenior Javascript DeveloperEdinburgh222012/03/29$433,060Airi SatouAccountantTokyo332008/11/28$162,700Brielle WilliamsonIntegration SpecialistNew York612012/12/

• Javascript
• HTML
• CSS
• Ajax
• Kịch bản phía máy chủ

Javascript hiển thị bên dưới được sử dụng để khởi tạo bảng được hiển thị trong ví dụ này

$[document].ready[function[] { // Setup - add a text input to each footer cell $['#example tfoot th'].each[ function [] { var title = $['#example thead th'].eq[ $[this].index[] ].text[]; $[this].html[ '' ]; } ]; // DataTable var table = $['#example'].DataTable[]; // Apply the search table.columns[].every[ function [] { var that = this; $[ 'input', this.footer[] ].on[ 'keyup change', function [] { that .search[ this.value ] .draw[]; } ]; } ]; } ];

Ngoài đoạn mã trên, các tệp thư viện Javascript sau được tải để sử dụng trong ví dụ này

HTML được hiển thị bên dưới là phần tử bảng HTML thô, trước khi nó được DataTables nâng cao

Ví dụ này sử dụng một chút CSS bổ sung ngoài nội dung được tải từ các tệp thư viện [bên dưới], để hiển thị chính xác bảng. CSS bổ sung được sử dụng được hiển thị bên dưới

________số 8

Các tệp thư viện CSS sau đây được tải để sử dụng trong ví dụ này nhằm cung cấp kiểu dáng của bảng

Bảng này tải dữ liệu bằng Ajax. Dữ liệu mới nhất đã được tải được hiển thị bên dưới. Dữ liệu này sẽ tự động cập nhật khi có bất kỳ dữ liệu bổ sung nào được tải

Làm cách nào để lọc dữ liệu từ DataTable?

Làm cách nào để lọc dữ liệu trong DataTable trong PHP?

API DataTables là gì?

Làm cách nào để sử dụng hoạt động DataTable của bộ lọc trong uipath?