如何自定义Bootstrap DataTable搜索框和记录视图位置

Question

我在使用bootstrap样式创建数据表格时遇到了问题。我从这个网站获取了数据表格 (http://datatables.net/manual/styling/bootstrap)

我发现它与我创建的视图不太吻合。我将导航栏放在表格上方，所以我想把搜索框和查看记录的按钮放在navbar-right中。我想达到这个效果。

之前的效果：

我希望它变成这样：

如何自定义呢？需要更改哪些javascript代码还是只需要使用jquery进行自定义就可以了？

- Sofyan Setiawan

---

搜索框可能位于页眉而不是数据表内部，您需要使用自定义HTML来实现此功能。 - brainless coder

你应该把你的代码放在Jsfiddle，这样我们就更容易帮助你了。 - lvarayut

Answer 1

http://datatables.net/examples/basic_init/dom.html

仔细阅读后再阅读其余评论内容 这里有一个例子：

当你理解后，请写下你的想法。

     $('#example').dataTable({


      "dom":' <"search"f><"top"l>rt<"bottom"ip><"clear">'
    }


      );
});

此将使搜索框拥有名为"search"的类，并保留其他所有内容，现在您可以使用CSS轻松编辑搜索框的位置。如果您想要像您发布的图片一样，请只写

。

"dom":' <"search"fl><"top">rt<"bottom"ip><"clear">'

- Omran

Answer 2

"sDom":'<"下拉框"l>'

同时CSS代码如下：

.dropdown { 浮动: 右侧; }

- Marinha do Nascimento