Nút print
cung cấp rất nhiều tính linh hoạt trong việc lựa chọn dữ liệu sẽ được xuất. Đối tượng exportOptions
có thể được sử dụng để xác định những cột và hàng nào được bao gồm trong dữ liệu được in. Một đối tượng DataTables selector-modifier
có thể được cung cấp bằng cách sử dụng tùy chọn exportOptions.modifier
và có khả năng xác định thứ tự của bảng in và nếu có bao gồm các hàng lọc, trong số các hành động khác
Trong ví dụ này, phần mở rộng Chọn cho DataTables được sử dụng để cung cấp cho người dùng cuối khả năng chọn các hàng bằng cách nhấp vào chúng. Hai nút in được sử dụng trong ví dụ này để minh họa tùy chọn exportOptions
- Nút đầu tiên sẽ in tất cả các hàng [sau khi lọc]
- Nút thứ hai sẽ chỉ in các hàng đã chọn
- 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[] { $['#example'].DataTable[ { dom: 'Bfrtip', buttons: [ { extend: 'print', text: 'Print all' }, { extend: 'print', text: 'Print selected', exportOptions: { modifier: { selected: true } } } ], select: true } ]; } ];
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
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