php - 使用 DataTable - 未捕获的 ReferenceError : table is not defined

Question

我有以下脚本，已经完美运行，然后需要在表的每个记录中放置第二个级别。在第一列中，我有一个按钮，单击该按钮将打开该记录的详细信息，如下图所示

<script type="text/javascript" language="javascript">
    $(document).ready(function() {
        console.log("Entrou na função");
        console.log("Versão DataTable=" + $.fn.dataTable.version);


        //init the table
        var dataTable = $('#employee-grid').DataTable({
            "language": {
                "url": "https://cdn.datatables.net/plug-ins/1.10.12/i18n/Portuguese-Brasil.json"
            },
            "columnDefs": [{
                className: "details-control",
                "targets": [0]
            }],


            //********************      
            //"destroy": true,                  
            "processing": true,
            "serverSide": true,
            "ajax": {
                url: "phpmysql_serverside.php", // json datasource
                type: "post", // method  , by default get
                error: function() { // error handling
                    $(".employee-grid-error").html("");
                    $("#employee-grid").append('<tbody class="employee-grid-error"><tr><th colspan="3">Sem registros</th></tr></tbody>');
                    $("#employee-grid_processing").css("display", "none");

                }
            }


        });

        var oTable;
        oTable = $('#employee-grid').DataTable();
        $('#aplicativos').change(function() {
            if ($(this).find("option:selected").text() === "Escolha um APP")
                oTable.fnFilter('');
            else
                oTable.fnFilter($(this).find("option:selected").text());
        });


        // Add event listener for opening and closing details
        $('#employee-grid tbody').on('click', 'td.details-control', function() {
            console.log("Click");
            var tr = $(this).closest('tr');
            var row = table.row(tr);

            if (row.child.isShown()) {
                // This row is already open - close it
                row.child.hide();
                tr.removeClass('shown');
            } else {
                // Open this row
                row.child(format(row.data())).show();
                tr.addClass('shown');
            }
        });
    });

    /* Formatting function for row details - modify as you need */
    function format(d) {
        // `d` is the original data object for the row
        return '<table cellpadding="5" cellspacing="0" border="0" style="padding-left:50px;">' +
            '<tr>' +
            '<td>Full name:</td>' +
            '<td>' + d.name + '</td>' +
            '</tr>' +
            '<tr>' +
            '<td>Extension number:</td>' +
            '<td>' + d.extn + '</td>' +
            '</tr>' +
            '<tr>' +
            '<td>Extra info:</td>' +
            '<td>And any further details here (images etc)...</td>' +
            '</tr>' +
            '</table>';
    }
</script>

我在单击选项卡的第一列时添加了以下代码。打开辅助记录。但是你给出了这个错误我已经尝试了一切但我不认为是问题

// Add event listener for opening and closing details
$('#employee-grid tbody').on('click', 'td.details-control', function() {
    console.log("Click");
    var tr = $(this).closest('tr');
    var row = table.row(tr);

    if (row.child.isShown()) {
        // This row is already open - close it
        row.child.hide();
        tr.removeClass('shown');
    } else {
        // Open this row
        row.child(format(row.data())).show();
        tr.addClass('shown');
    }
});

单击该按钮会显示以下消息:

Uncaught ReferenceError :表未定义

编辑错误发生在这里

Var row = table.row (tr);

Answer 1

我只能加

var oTable = $('#employee-grid').DataTable();