Question

我正在使用jqxTreeGrid小部件并遇到TypeError: Cannot set property 'treeGrid' of null错误。

我遇到过一些消息来源说这个表所附的div没有被找到，但是我console.log找到了div。

可能导致此问题的任何其他建议？

VIEW
<div id="treeGrid"></div>


SCRIPT
var tableDiv = $("#treeGrid");
    var tableData = <%=raw @array_with_data.to_json%>;
    var treeSource, treeData;

    treeSource = {
        dataType: "json",
        dataFields: [
            { name: "id", type: "number" },
            { name: "foo_id", type: "number" },
            { name: "foo_name", type: "string" },
            { name: "bar_id", type: "number" },
            { name: "bar_name", type: "string" },
            { name: "noob_name", type: "string" }
        ],
        hierarchy: {
            keyDataField: { name: "id" },
            parentDataField: { name: "foo_id" }
        },
        id: "id",
        localData: tableData
    };

    treeData = new $.jqx.dataAdapter(treeSource);
    treeData.dataBind();

    // build table as a tree table:
    tableDiv.jqxTreeGrid({
        width: "100%",
        source: treeData,
        sortable: true,
        filterable: true,
        pageable: true,
        selectionMode: "singleRow",
        columns: [
            { text: "ID", dataField: "id", hidden: true },
            { text: "Foo ID", dataField: "foo_id", columnGroup: "foo", width: "20%" },
            { text: "Foo Name", dataField: "foo_name", columnGroup: "foo", width: "20%" },
            { text: "Bar ID", dataField: "bar_id", columnGroup: "bar", width: "20%" },
            { text: "Bar Name", dataField: "bar_name", columnGroup: "bar", width: "20%" },
            { text: "Noob Name", dataField: "noob_name", columnGroup: "noob", width: "20%" }
        ],
        columnGroups: [
            { text: "Foo", name: "foo" },
            { text: "Bar", name: "bar" },
            { text: "Noob", name: "noob" }
        ]
    });

Answer 1

我遇到了同样的问题。

我的问题是，我在jqxtreegrid.js之后加入了jqxdatatable.js

WRONG：

<script type="text/javascript" src="/js/jqwidgets/jqxtreegrid.js"></script>  
<script type="text/javascript" src="/js/jqwidgets/jqxdatatable.js"></script>

正确：

<script type="text/javascript" src="/js/jqwidgets/jqxdatatable.js"></script>  
<script type="text/javascript" src="/js/jqwidgets/jqxtreegrid.js"></script>

当我把它放在另一个包含之前时，它起作用了

TypeError：无法将属性'treeGrid'设置为null

1 个答案: