Question

我如何配置Datatables ColumnFilter插件来自定义每列底部输入过滤器的宽度？

我需要更改每个输入框中显示的占位符。我不希望显示数据字段的名称，但我想显示自定义字符串。

是否可以通过Columnfilter或Datatable配置？

提前致谢，朱塞佩。

Answer 1

嗯，你有没有研究过代码？它很容易改变。占位符只是所需<tfoot>部分中给出的内容。如果我们查看经典ColumnFilter demo，结构是：

<tfoot>
    <tr>
        <th>Rendering engine</th>
        <th>Browser</th>
        <th>Platform(s)</th>
        <th>Engine version</th>
        <th>CSS grade</th>
    </tr>
</tfoot>

将其更改为例如：

<tfoot>
    <tr>
        <th>Enter engine name</th>
        <th>Enter browser name</th>
        <th>Enter platform</th>
        <th>Enter engine version</th>
        <th>Enter CSS grade</th>
    </tr>
</tfoot>

演示 - ＆gt;的 http://jsfiddle.net/pbu5xfyp/

没有选项可以设置ColumnFilter生成的各个输入的样式。这必须通过CSS中的“手”来完成; imho最简单的方法是（例子）：

tfoot th:nth-child(1) input { width: 40px; } tfoot th:nth-child(2) input { width: 240px; background-color: #ebebeb; } tfoot th:nth-child(3) input { width: 100px; color: red; }

等，演示 - ＆gt;的 http://jsfiddle.net/3uqvwofo/

如何更改Datatables columnFilter插件的标题和宽度

1 个答案: