datatables - 我们如何更改 DataTables 中搜索字段的宽度

Question

我可以更改 dataTables 中搜索文本字段的宽度吗？

我现在正在编写以下代码，但它不起作用。

$('#example').dataTable()
          .columnFilter({   sPlaceHolder: "head:before",
                    aoColumns: [    { type: "text",width:"10px" },
                                { type: "date-range" },
                                                { type: "date-range" }
                        ]

        });

如果我的数据表是动态生成的，如下所示:

$('#example').dataTable({
                                "aaData": aDataSet,
                                "aoColumns": [
                                    { "sTitle": "#","sWidth": "10px" },
                                    { "sTitle": "ID" },
                                    { "sTitle": "Staff Name" },
                                    { "sTitle": "Rig Days" },
                                    { "sTitle": "Manager"},
                                    { "sTitle": "Grade"},
                                    { "sTitle": "Tools"},
                                    { "sTitle": "Vacations"},
                                    { "sTitle": "Presently On"},
                                    ]
                            });
                            }

如何在这个动态创建的 DataTable 中添加搜索字段以按每列搜索？

Answer 1

要更改搜索框的宽度，我所要做的就是进入我的 .css文件并输入以下内容:

.dataTables_filter input { width: 300px }