Jquery Datatable 搜索框左对齐答案

【问题标题】：Jquery Datatable search box align leftJquery Datatable 搜索框左对齐
【发布时间】：2015-01-28 03:19:26
【问题描述】：

我正在使用主干和 jQuery 数据表。默认情况下，数据表的搜索框位于右侧 - 我想把它对齐到左边。以下是我的代码：

onDomRefresh: function(){
   $(this.el).find('table').dataTable({ "dom": '<"top"i>rt<"bottom"flp><"clear">',"bLengthChange": false });
}

但它不起作用。

【问题讨论】：

【解决方案1】：

你可以使用类似的东西

jQuery(document).ready(function($) {
    $(tableSelector).DataTable({
        "dom": '<"pull-left"f><"pull-right"l>tip'
    });
});

与

.pull-left{float:left!important;}
.pull-right{float:right!important;}

结果是这样的：

（请注意，屏幕截图上使用了 Twitter Bootsrap，用于额外的表格样式）

有关 DataTables DOM 操作的更多信息，请参阅here。

【讨论】：

【解决方案2】：

看起来这对于 sDom 操作是不可能的，但您可以在 jquery.DataTables.css 中调整 .dataTables_filter 的 css 规则，或者最好在自定义 css 文件中覆盖此规则：

#table_div_id.dataTables_filter {
  float: right;
  text-align: right;
}

table_div_id是用于初始化的容器div的id：$('#table_div_id').dataTable()

【讨论】：

【解决方案3】：

$(document).ready(function () {

    $('#TableId').DataTable( "dom": '<"pull-left"f><"pull-right"l>tip' );        
});

【讨论】：