0

我正在使用 1.0.1 版的蒲公英-Thymeleaf。下面是我的蒲公英数据表的定义。表格中有 3 个固定列,然后是一些在页面渲染时添加的列。

<table class="reportTable" dt:table="true" dt:pageable="false" dt:filterable="false" dt:processing="false" dt:serverside="false">
    <thead>
        <tr>
            <th>Day</th>
            <th>No of calls</th>
            <th>Duration</th>
            <th:block th:each="sb : ${timePeriodColumns}">
                <th th:text="${sb}">x</th>
            </th:block>
        </tr>
    </thead>
    <tbody>
        <tr th:each="sb : ${monthCallsByTimePeriod}">
            <td th:text="${sb.day}">x</td>
            <td th:text="${sb.numberOfCallsPerDay}">x</td>
            <td th:text="${sb.callDurationPerDayInMinutes}">x</td>

            <th:block th:each="tp : ${sb.dataForTimePeriod}">
                <td th:text="${tp.numberOfCalls}">x</td>
                <td th:text="${tp.callDurationInMinutes}">x</td>
            </th:block>
        </tr>
    </tbody>
</table>

表格可以很好地呈现为 HTML,但是当 Dandelion 尝试应用 Datatable 时出现 javascript 错误TypeError: col is undefinedjquery.dataTables.js我可以看到它遍历表格的列,并且在调试时我可以看到 oSettings.aoColumns 中只有 3 个固定列。因此,当它遇到第一个动态添加的列时处理数据TBODY时,会发生错误,因为 Datatable 不“知道”非固定列。

如果我省略了该TBODY部分(因此只有THEAD部分表格呈现),则不会发生错误,但我可以看到固定列具有 Datatable 的排序控件,但非固定列没有这些控件,就好像它们被排除在外一样。但是查看 HTML 源代码,我看不出这些列之间的区别:

<thead>
    <tr>
        <th>Day</th>
        <th>No of calls</th>
        <th>Duration</th>
        <th>Added col1</th>
        <th>Added col2</th>
    </tr>
</thead>

我究竟做错了什么?如何在渲染时向蒲公英数据表添加一些列?

4

1 回答 1

0

作为一种解决方法,我将前三列添加到timePeriodColumnsList 并将其留给 Thymeleaf 以呈现所有列<th th:each ...>

<thead>
    <tr>
        <th th:each="sb : ${timePeriodColumns}" th:text="${sb}">x</th>
    </tr>
</thead>

我怀疑使用 < 存在问题th:block ...>,但我无法证明这一点。无论如何,这解决了我的问题。

于 2017-05-30T20:12:15.973 回答