Question

我已经阅读了有关此主题的所有先前主题，但仍然最终获得

未捕获的TypeError：无法读取属性＆＃39;长度＆＃39;未定义的

Chrome和Internet Explorer中的

。我创建了一个空文件，命名为＆＃34; DataTable.js＆＃34;并从here

复制粘贴代码

然后我在构建表的代码末尾添加了以下行：

 $('#standard_report_table').DataTable();

我的脚本：

    var buildStandardReportTable = function()
    {
        var divContent = "";

        var url = "/InputData/db_getSqlQueryResult";

        $.ajax({
            url: url,
            type: "POST",
            async: false,

            data: { sqlStr: "SELECT id, name_rus, visual_level, children_number, parent_id, effect_on_parent_id, lft, rgt, children_are_visible, report_type_id, font_color " +
                            "FROM report_entries_template_standard " + 
                            "WHERE visible = 1 AND report_type_id = " + $("#reportTypeCombobox").val() + ' ' +
                            "ORDER BY lft", connectionStr: "dbCon"},

            success: function (data)
            {

                var divContent = '';
                var obj = jQuery.parseJSON(data);           
                divContent = buildStandarReportContent(obj);

                //$('#choosenav1')[0].style.display = "block";
                //$('#choosenav2')[0].style.display = "block";
                //$('#choosenav3')[0].style.display = "block";

                $("#standard_report_table").html(divContent);
                $('#standard_report_table').DataTable();
            }
        })
    }
var buildStandarReportContent = function (obj)
{
    var divContent = '<thead border="0"><tr>';
    divContent += '<th style="width: 30px"></th>';
    divContent += '<th style="width: 30px"></th>';
    divContent += '<th style="width: 30px"></th>';
    divContent += '<th style="width: 30px"></th>';
    divContent += '<th style="width: 30px"></th>';
    divContent += '<th style="width: 30px"></th>';
    divContent += '<th style="width: 30px"></th>';
    divContent += '<th style="width: 1000px;">Статья</th>';
    divContent += '<th>ID</th>';
    divContent += '</tr></thead>';
    // Table content

    divContent += '<tbody id="table_data">';         

    for (i = 0; i < obj.length; i++) 
    {
        //'<tr class="' + (obj[i].Уровень == 1 ? "success" : "")
        //+ (obj[i].Уровень == 2 ? "warning" : "") + '"><td style="vertical-align: middle"><div style="margin-left:' + (obj[i].Уровень - 1) * 20 + 'px">' + obj[i].Статья_название + '</div></td>';
        divContent += '<tr style="height: 10px; background-color:' + obj[i].font_color + '" ' +
                           'onmouseover = "setElementsVisibility(' + i + ', 1)" ' +
                           'onmouseout = "setElementsVisibility(' + i + ', 0)">';

        divContent += '<td><div id = "add_child_sign' + i + '" style = "display : none";"><img src= "/Content/pics/plus_sign1.png" ' +
                                        'style= "height:10px;width:10px;cursor:pointer" ' +
                                        'onclick = "openAddNewChildWindow(' + obj[i].id + ')"</div></td>';
        divContent += '<td><div id = "delete_sign' + i + '" style = "display : none";"><img src= "/Content/pics/delete_sign1.png" ' +
                                        'style= "height:10px;width:10px;cursor:pointer" ' +
                                        'onclick = "deleteChild(' + obj[i].id + ')"</div></td>';
        divContent += '<td><div class = "glyphicon glyphicon-triangle-top" varia-hidden="true" id = "arrowup' + i + '" style = "' +
                                        'height:10px;width:10px;cursor:pointer; color:red" ' +
                                        'onclick = "swapChild(' + obj[i].id + ', \'up\')"></div>';
        divContent += '<td><div class = "glyphicon glyphicon-triangle-bottom" id = "arrowdown' + i + '" style = " ' +
                                        'height:10px; width:10px; cursor:pointer" ' +
                                        'onclick = "swapChild(' + obj[i].id + ', \'down\')"></div></td>';
        divContent += '<td><div id = "arrowleft' + i + '" style = "display : none";"><img src= "/Content/pics/arrowleft_sign1.png" ' +
                                        'style= "height:10px;width:10px;cursor:pointer" ' +
                                        'onclick = "editVisualLevel(' + obj[i].id + ', \'left\')"</div></td>';
        divContent += '<td><div id = "arrowright' + i + '" style = "display : none";"><img src= "/Content/pics/arrowright_sign1.png" ' +
                                        'style= "height:10px;width:10px;cursor:pointer" ' +
                                        'onclick = "editVisualLevel(' + obj[i].id + ', \'right\')"</div></td>';

        divContent += '<td><div id = "edit_sign' + i + '" style="display: none;"><div style = "vertical-align:bottom"><img src= "/Content/pics/edit_sign1.png" ' +
                                        'style= "height:10px;width:10px;cursor:pointer" ' +
                                        'onclick = "openEditChildWindow(' +
                                        obj[i].id + ',\'' + obj[i].name_rus + '\',\'' + obj[i].name + '\',' + obj[i].effect_on_parent_id + ',' +
                                        obj[i].parent_id + ',' + obj[i].report_type_id + ')"</div></td>';

        divContent += '<td><div class = "cell_level_' + obj[i].visual_level + '" style = "margin-left : ' + 30 * (obj[i].visual_level - 1) + 'px; ' +
                                   'cursor:' + (obj[i].children_number == 0 ? "default" : "pointer") + '" ' +
                                   'onclick="collapseTreeNode(' + obj[i].lft + ',' + obj[i].rgt + ',' + obj[i].children_are_visible + ','+ obj[i].children_number + ')">';
        divContent += obj[i].name_rus + '<span style="color:#A0A0A0; font-weight: normal;">&nbsp(' + obj[i].children_number + ')</span></div></td><td>' + obj[i].id + '</td><tr>';

    }

    divContent += '</tbody>'
    divContent += '</table>';
    return divContent;
}

HTML：

<div class="container">
        <table id="standard_report_table" class="table table-striped"></table>
    </div>

Answer 1

以这种方式使用。

var obj = jQuery.parseJSON(data);
$('#standard_report_table').DataTable({
    "ajax": obj
});

定义html

<table id="standard_report_table" class="display" cellspacing="0" width="100%">
        <thead>
            <tr>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
                <th></th>
            </tr>
        </thead>
    </table>

无法读取属性＆＃39;长度＆＃39; DataTable.js中未定义的错误

1 个答案: