数据表将类添加到过滤器 [英] datatables add class to filters

问题描述

我正在寻求一种方法来为jQuery数据表过滤器添加一个额外的自定义类（每页记录和搜索）

I am currently seeking a method to add an additional custom class to the jQuery datatables filters (Records per page and Search)

这些项目呈现如下：

    <div id="DataTables_Table_0_length" class="dataTables_length">
    <label><select size="1" name="DataTables_Table_0_length" aria-controls="DataTables_Table_0">
    <option value="10" selected="selected">10</option>
    <option value="25">25</option><option value="50">50</option>
    <option value="100">100</option>
    </select> records per page</label>
    </div>

和

    <div class="dataTables_filter" id="DataTables_Table_0_filter">
    <label>Search: <input type="text" aria-controls="DataTables_Table_0"></label>
    </div>

有些建议会像往常一样非常感激。

Does anyone know how I can best add an additional class to each of them? Some advise would be as usual very much appreciated.

推荐答案

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

Check out http://legacy.datatables.net/styling/custom_classes. DataTables has a slightly complicated way to override the CSS classes for some of the core elements. Here's one way

$(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/ 。

Check out a working example here: http://jsfiddle.net/k2ava/3/.

这篇关于数据表将类添加到过滤器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！