i using jqxtreegrid widget , running typeerror: cannot set property 'treegrid' of null
error.
i've come across sources said div table being attached not being found console.log
div , found.
any other suggestions might causing issue?
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 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" } ] });
i had same problem.
my problem was, included jqxdatatable.js after jqxtreegrid.js
wrong:
<script type="text/javascript" src="/js/jqwidgets/jqxtreegrid.js"></script> <script type="text/javascript" src="/js/jqwidgets/jqxdatatable.js"></script>
correct:
<script type="text/javascript" src="/js/jqwidgets/jqxdatatable.js"></script> <script type="text/javascript" src="/js/jqwidgets/jqxtreegrid.js"></script>
when put before other include, worked