Datatables免费替代编辑器

时间:2017-03-15 09:18:58

标签: javascript datatables-1.10

我像这样设置Datatable:http://jsfiddle.net/rmcmaster/bbLjzspf/22/。 然后我添加行并完美地工作。

在此之后我加载并重新启动数据表与新的列和行数据,当我将添加新行get i时出现此错误警告:

DataTables warning: table id=myTable - Requested unkwnown parameter '2' for row 1, column 2.

这是我的例子:

<div class="container">
    <button type="button" id="saveTableBtn" style="display: none;">Save</button>
    <button type="button" id="loadTableBtn" style="display: inline-block">Load</button>
    <button type="button" id="loadTableBtn2" style="display: inline-block">Load 2</button>
    <br /><br /><br />
    <div id="tableWrapper"></div>
</div>

    <script>
$(document).ready(function() {
    var myTable = null;
    var initTable = function(columns, data) {
        var tableId = "myTable";
        var dataSet = data;
        var columnDefs = columns;

        $("#tableWrapper table").remove();
        $("#tableWrapper").html('<table cellpadding="0" cellspacing="0" border="0" class="dataTable table table-striped" id="' + tableId + '"><thead><tr>' + columns + '</tr></thead></table>');

        myTable = $('#' + tableId).DataTable({
            "sPaginationType": "full_numbers",
            ajax: data,
            dom: 'Bfrtip',        // Needs button container
            select: 'single',
            responsive: true,
            altEditor: true,     // Enable altEditor
            destroy: true,
            buttons: [
                {
                    text: 'Add',
                    name: 'add'        // do not change name
                },
                {
                    extend: 'selected', // Bind to Selected row
                    text: 'Edit',
                    name: 'edit'        // do not change name
                },
                {
                    extend: 'selected', // Bind to Selected row
                    text: 'Delete',
                    name: 'delete'      // do not change name
                }
            ]

        });

        $("#saveTableBtn").css("display", "inline-block");

        $('#saveTableBtn').off().click(function() {
            console.log(myTable.rows().data());
        });
    }

    $("#loadTableBtn").click(function() {
        var dataSet = "data.json";
        var columnDefs = "<th>Name</th><th>Position</th><th>Office</th><th>Extn.</th><th>Start date</th><th>Salary</th>";

        initTable(columnDefs, dataSet);
    });

    $("#loadTableBtn2").click(function() {
        var dataSet = "data2.json";
        var columnDefs = "<th>Name</th><th>Position</th>";

        initTable(columnDefs, dataSet);
    });
});
</script>

对此有何解决方案?

0 个答案:

没有答案