datatables将类添加到filter

我目前正在寻找一种方法来为jQuery数据表filter添加额外的自定义类（ 每页记录和搜索 ）

这些项目呈现如下：

  10 2550 100  records per page  

和

  
 Search:   

有谁知道我怎样才能最好地为每个人增加一个额外的课程？ 有些建议会像往常一样非常感激。

Answer 1

查看http://legacy.datatables.net/styling/custom_classes 。 DataTables有一种稍微复杂的方法来覆盖某些核心元素的CSS类。 这是一种方式

 $(document).ready(function() { var extensions = { "sFilter": "dataTables_filter custom_filter_class", "sLength": "dataTables_length custom_length_class" } // Used when bJQueryUI is false $.extend($.fn.dataTableExt.oStdClasses, extensions); // Used when bJQueryUI is true $.extend($.fn.dataTableExt.oJUIClasses, extensions); $('#example').dataTable(); }); 

在这里查看一个工作示例： http ： //jsfiddle.net/k2ava/3/ 。

Answer 2

我使用的是DataTable 1.10.2并使用：

 $.extend( $.fn.dataTableExt.oStdClasses, { "sFilterInput": "form-control", "sLengthSelect": "form-control" }); 

我通过extend函数而不是jquery。

Answer 3

使用fnDrawCallback可以使用jQuery轻松完成此操作。 在这里，我为Bootstrap添加了两个类的样式

 fnDrawCallback: function( oSettings ) { $('div#oTable_length select, div#oTable_filter input').addClass("form-control input-sm"); },