2015-04-27 50 views
0

我正在使用jqxTreeGrid小部件並運行到TypeError: Cannot set property 'treeGrid' of null錯誤。TypeError:無法設置null屬性'treeGrid'

我遇到一些消息來源表示,表格被附加到的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" } 
     ] 
    }); 
+0

所以這意味着如果你把控制檯日誌放在你的代碼之前它在那裏工作?和數據正在打印到頁面作爲有效的JavaScript變量? – charlietfl

+0

如果我在'tableDiv.jqxTreeGrid({'並將一些文本放置在所述div中之前放置'console.log(tableDiv.text());'然後文本出現在控制檯中 – mikeymurph77

+0

會檢查插件的問題跟蹤器 – charlietfl

回答

0

我有同樣的問題。

我的問題是,我包括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> 

當我把它之前,其他包括,它工作

相關問題