Làm cách nào để đặt lớp học trên trường 'tìm kiếm' trên plugin có thể thay đổi dữ liệu. Tôi cũng đang sử dụng giao diện người dùng Jquery UI.Jquery Datatables: đặt lớp trên trường nhập bộ lọc
$('#idSmovData').dataTable({
"sScrollY": "600px"
,"bPaginate": false
,"bFilter": true
,"bJQueryUI": true
,"bInfo": false
,"bSort": false
});
Bạn có thể thiết lập các lớp bộ lọc tìm kiếm wrapper div style sử dụng oStdClasses
$.fn.dataTableExt.oStdClasses["sFilter"] = "my-style-class";
Và vì sử dụng css thường xuyên để nhắm mục tiêu các trường nhập tìm kiếm:
.my-style-class input[type=text] {
color: green;
}
Vui lòng tham khảo datatables styling để biết thêm chi tiết.
Cảm ơn. Đã phải thay đổi để sử dụng oJUIClasses, nhưng đã đến đó cuối cùng. – Keith
@Keith sFilter thực sự là tài sản của oStdClasses. nhưng, bạn có thể sử dụng oJUIClasses vì nó mở rộng oStdClasses. –
Trên liên kết kiểu dáng datatables mà bạn tham chiếu, nó nói: $ .fn.dataTableExt.oStdClasses - được sử dụng khi bJQueryUI là $ .fn.dataTableExt.oJUIClasses giả - được sử dụng khi bJQueryUI là đúng. Khi tôi đang sử dụng "bJQueryUI": true, tôi giả định rằng tôi sẽ cần phải sử dụng oJUIClasses. Có tương đương với sFilter cho oJUIClasses, hay tôi đang thiếu cái gì đó? – Keith
$('div.dataTables_filter input').addClass('form-control');
$('div.dataTables_length select').addClass('form-control');
Ở đây tôi thêm lớp Bootstrap form-control vào đầu vào bộ lọc và chọn độ dài, làm ví dụ.
chính xác những gì tôi cần! – Shlo
trong jquery.datatables.css để chọn .dataTables_wrapper .dataTables_filter đầu vào (dòng: 288) thêm đường viền: solid #ddd 1px; border-radius: 5px; hoặc bất cứ điều gì bạn thích. –