如何移除jQuery DataTables插件添加的搜索栏和页脚？

Question

如何移除jQuery DataTables插件添加的搜索栏和页脚？

jqueryhtmldatatables

324

我正在使用jQuery DataTables。

我想要移除默认添加到表格中的搜索栏和底部显示可见行数的页脚。基本上，我只想使用这个插件进行排序。能否做到这一点？

- leora

您可以按照此处的描述有效地使用sDom - https://dev59.com/ulQJ5IYBdhLWcg3wbFSx#53885264 - Tushar Walzade

1

使用 dom: 'lrtip' 选项 - Taufik Nur Rahmanda

23个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- newProgramer · Answer 1

我通过为页脚分配一个ID并使用CSS进行样式设置来完成了这个任务：

    <table border="1" class="dataTable" id="dataTable_${dtoItem.key}" >
     <thead>
        <tr>
            <th></th>

        </tr>
    </thead>
 <tfoot>
    <tr>
            <th id="FooterHidden"></th>
    </tr>
</tfoot>
<tbody>

    <tr>

                <td class="copyableField"></td>

    </tr>
 </tbody>
</table>

然后使用 CSS 进行样式设置：

#FooterHidden{
   display: none;
}

如上所述的方式对我不起作用。

- WalterV · Answer 2

我认为最简单的方法是：

<th data-searchable="false">Column</th>

您可以仅编辑需要修改的表格，而无需更改公共CSS或JS。

- Godly Mathew · Answer 3

        $(document).ready(function() {          
        var table = $('#example').DataTable({
          dom: 'lrt',
          paging: false,
          info: false,
          "search": {
            "caseInsensitive": true
          }
        });
      $('#txtSearch').on('keyup change', function() {
        dataTable_Search($(this).val());
      });

      $('#btnClear').on('click', function() {
        $('#txtSearch').val('');
        dataTable_Search('');
      });

      function dataTable_Search(v) {
        table.search(v).draw();
      }
    });

Fiddler: https://jsfiddle.net/godlymathew/mbn78xdh/