Question

我有数据表的问题。

这是我的数据表，看起来像这样的代码：

<table class="table table-striped table-bordered table-hover tree t-a-left nowrap TableWork" data-fixedColumnsRight="2" data-fixedColumnsLeft="2">
    <thead>
        <tr>
            <th>Letra A</th>
            <th>Letra B</th>
            <th>Letra C</th>
            <th>Letra D</th>
            <th>Letra E</th>
            <th>Letra F</th>
            <th>Letra G</th>
            <th>Letra H</th>
            <th>Letra I</th>
            <th>Letra A</th>
            <th>Letra B</th>
            <th>Letra C</th>
            <th>Letra D</th>
            <th>Letra E</th>
            <th>Letra F</th>
            <th>Letra G</th>
            <th>Letra H</th>
            <th>Letra I</th>
            <th>Letra A</th>
            <th>Letra B</th>
            <th>Letra C</th>
            <th>Letra D</th>
            <th>Letra E</th>
            <th>Letra F</th>
            <th>Letra G</th>
            <th>Letra H</th>
            <th>Letra I</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Dato A1</td>
            <td>Dato b1</td>
            <td>Dato c1</td>
            <td>Dato d1</td>
            <td>Dato e1</td>
            <td>Dato f1</td>
            <td>Dato g1</td>
            <td>Dato h1</td>
            <td>Dato i1</td>
            <td>Dato A1</td>
            <td>Dato b1</td>
            <td>Dato c1</td>
            <td>Dato d1</td>
            <td>Dato e1</td>
            <td>Dato f1</td>
            <td>Dato g1</td>
            <td>Dato h1</td>
            <td>Dato i1</td>
            <td>Dato A1</td>
            <td>Dato b1</td>
            <td>Dato c1</td>
            <td>Dato d1</td>
            <td>Dato e1</td>
            <td>Dato f1</td>
            <td>Dato g1</td>
            <td>Dato h1</td>
            <td>Dato i1</td>
        </tr>
        <tr>
            <td>Dato A2</td>
            <td>Dato b2</td>
            <td>Dato c2</td>
            <td>Dato d2</td>
            <td>Dato e2</td>
            <td>Dato f2</td>
            <td>Dato g2</td>
            <td>Dato h2</td>
            <td>Dato i2</td>
            <td>Dato A2</td>
            <td>Dato b2</td>
            <td>Dato c2</td>
            <td>Dato d2</td>
            <td>Dato e2</td>
            <td>Dato f2</td>
            <td>Dato g2</td>
            <td>Dato h2</td>
            <td>Dato i2</td>
            <td>Dato A2</td>
            <td>Dato b2</td>
            <td>Dato c2</td>
            <td>Dato d2</td>
            <td>Dato e2</td>
            <td>Dato f2</td>
            <td>Dato g2</td>
            <td>Dato h2</td>
            <td>Dato i2</td>
        </tr>
        <tr>
            <td>Dato A3</td>
            <td>Dato b3</td>
            <td>Dato c3</td>
            <td>Dato d3</td>
            <td>Dato e3</td>
            <td>Dato f3</td>
            <td>Dato g3</td>
            <td>Dato h3</td>
            <td>Dato i3</td>
            <td>Dato A3</td>
            <td>Dato b3</td>
            <td>Dato c3</td>
            <td>Dato d3</td>
            <td>Dato e3</td>
            <td>Dato f3</td>
            <td>Dato g3</td>
            <td>Dato h3</td>
            <td>Dato i3</td>
            <td>Dato A3</td>
            <td>Dato b3</td>
            <td>Dato c3</td>
            <td>Dato d3</td>
            <td>Dato e3</td>
            <td>Dato f3</td>
            <td>Dato g3</td>
            <td>Dato h3</td>
            <td>Dato i3</td>
        </tr>
    <tbody>
</table>

我正在尝试使用固定列中的动态Data- *值初始化数据表：

$('table.TableWork').each(function () {
    $(this).DataTable({
        paging:   false,
        ordering: false,
        info:     false,
        searching: false,
        autoWidth: true,
        scrollCollapse: true,
        responsive: false,
        scrollY: "30vh",
        scrollX: true,
        fixedColumns:   {
            leftColumns: function () {
                return $(this).data("fixedColumnsLeft");
            },
            rightColumns: function (){
                return $(this).data("fixedColumnsRight");
            },
        }
    })
});

但不起作用，请发送此错误，在其他数据中，我试图访问其他信息，并且它可以正常工作。没有初始化的column部分，也可以正常工作；我不明白为什么“功能”不起作用：

jquery.min.js?20180712203240:2 Uncaught TypeError: Cannot read property 'appendChild' of null
    at m._fnClone (datatables.min.js?20180712203240:370)
    at m._fnCloneLeft (datatables.min.js?20180712203240:369)
    at m._fnDraw (datatables.min.js?20180712203240:368)
    at HTMLTableElement.<anonymous> (datatables.min.js?20180712203240:359)
    at HTMLTableElement.dispatch (jquery.min.js?20180712203240:3)
    at HTMLTableElement.q.handle (jquery.min.js?20180712203240:3)
    at Object.trigger (jquery.min.js?20180712203240:4)
    at HTMLTableElement.<anonymous> (jquery.min.js?20180712203240:4)
    at Function.each (jquery.min.js?20180712203240:2)
    at r.fn.init.each (jquery.min.js?20180712203240:2)

我找不到原因。

Answer 1

我没有找到解决此特定问题的解决方案，但是我对插件的初始化方式进行了修改。

$('table.TableWork').each(function () {
        var left = $(this).attr("data-fixedColumnsLeft");
        var right = $(this).attr("data-fixedColumnsRight");
        left = (typeof left==='undefined')? 0:left;
        right = (typeof right==='undefined')? 0:right;
        $(this).DataTable({
            paging:   false,
            ordering: false,
            info:     false,
            searching: false,
            autoWidth: true,
            scrollCollapse: true,
            responsive: false,
            scrollY: "30vh",
            scrollX: true,
            fixedColumns:   {
                leftColumns: left,
                rightColumns: right,
            }
        })
    });

Datatables.net使用“动态固定”列初始化数据表

1 个答案: