数据表组件未正确对齐

Question

我正在使用一个简单的表格与datatable.js。

如果我有6或7列没问题。搜索和分页器正确对齐，但有3列或4列显示在三列中。

在https://datatables.net/examples/basic_init/dom.html 展示如何正确配置这个，但我正在使用百里香并抱怨语法

更新1

我已将问题发布在： https://datatables.net/forums/discussion/45926/dom-in-thymeleaf-html-pages

这就是帖子：

尝试在https://datatables.net/examples/basic_init/dom.html

中添加代码

在百万美元的html页面中，但它抱怨这段代码：

"dom": '<"top"i>rt<"bottom"flp><"clear">'

我试图改变“by”并使用转义字符，但没办法。

我的html页面中的这个脚本不起作用：

$(document).ready(function() {
    $("#mensuales").DataTable({
        "dom": '<"top"i>rt<"bottom"flp><"clear">',
        "language": {
            "url": "//cdn.datatables.net/plug-ins/1.10.15/i18n/Spanish.json"
        },
        "lenghtMenu": [
            [5, 12, 15, 20, -1],
            [5, 12, 15, 20, "Todos"]
        ],
        "ordering": true,
        stateSave: true
    });
});

Allan说代码是正确的，但我无法在我的网页中使用。

更新2

有什么建议吗？

由于

Answer 1

尝试：

<script type="text/javascript" th:inline="javascript">
  /*<![CDATA[*/
    $(document).ready(function() {
      $("#mensuales").DataTable({
        "dom": '<"top"i>rt<"bottom"flp><"clear">',
        "language": {
            "url": "//cdn.datatables.net/plug-ins/1.10.15/i18n/Spanish.json"
        },
        "lenghtMenu": [
            [5, 12, 15, 20, -1],
            [5, 12, 15, 20, "Todos"]
        ],
        "ordering": true,
        stateSave: true
      });
    });
  /*]]>*/
</script>