带有dataAdapter的JQWidgets treegrid无法呈现 [英] JQWidgets treegrid with dataAdapter not rendering
本文介绍了带有dataAdapter的JQWidgets treegrid无法呈现的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我在AngularJS环境中，试图使jqWidgets TreeGrid正常工作.
I'm in the AngularJS environment, and trying to get a jqWidgets TreeGrid working.
我已将dataAdapter全部与Json格式的数据连接起来，但是网格渲染了空数据，但显示了列(请参见所附图像).
I have the dataAdapter all wired up with the Json formatted data, however the grid renders empty data but shows columns (see attached image).
我正在使用此非基于Angular的演示作为连接dataAdapter的指南:
I'm using this non Angular-based demo as a guide to wire up the dataAdapter:
因为此Angular示例太简单了(即不使用dataAdapter对象)-
because this Angular sample is too simple (i.e. doesn't use the dataAdapter object) -
http://www.jqwidgets.com/jquery -widgets-documentation/documentation/angularjs/angularjs.htm
这是html片段:
<div class="widget-content user">
<jqx-treegrid jqx-instance="jqGridHierObj" jqx-settings="vm.jqGridHierSettings">
</jqx-treegrid>
</div>
这是我的treegrid设置的样子，包括数据和模型.
Here's what my treegrid settings look like, complete with data and model.
似乎JQ正在注入附加的"_source"属性，因为我当然不是. 还有一个额外的"localdata"属性. ex/我添加了"localData"属性:
It appears that JQ is injecting the additional "_source" property because I'm certainly not. There also an extra "localdata" property. ex/ I've added the "localData" property:
{
"altrows": true,
"width": 600,
"height": 300,
"source": {
"_source": {
"datatype": "json",
"id": "id",
"datafields": {
"field0": {
"type": "string"
},
"field1": {
"type": "number"
},
"field2": {
"type": "number"
}
},
"hierarchy": {
"keyDataField": {
"name": "id"
},
"parentDataField": {
"name": "parent"
}
},
"localData": [
{
"id": 0,
"parent": 29,
"field0": "Goldman",
"field1": 0,
"field2": 0
},
{
"id": 1,
"parent": 29,
"field0": "IBM",
"field1": 0,
"field2": 0
},
{
"id": 2,
"parent": 29,
"field0": "JP Chase",
"field1": 0,
"field2": 0
},
{
"id": 3,
"parent": 34,
"field0": "MINESCONDIDA",
"field1": 0,
"field2": 0
},
{
"id": 4,
"parent": 29,
"field0": "Merrill",
"field1": 0,
"field2": 0
},
{
"id": 5,
"parent": 29,
"field0": "Nokia",
"field1": 0,
"field2": 0
},
{
"id": 6,
"parent": 29,
"field0": "Pequot",
"field1": 0,
"field2": 0
},
{
"id": 7,
"parent": 35,
"field0": "Pimco Fund A",
"field1": 0,
"field2": 0
},
{
"id": 8,
"parent": 35,
"field0": "Pimco Fund B",
"field1": 0,
"field2": 0
},
{
"id": 9,
"parent": 29,
"field0": "Deutsche",
"field1": 0,
"field2": 0
},
{
"id": 10,
"parent": 13,
"field0": "Ditech",
"field1": 0,
"field2": 0
},
{
"id": 11,
"parent": 32,
"field0": "GM Isuzu",
"field1": 0,
"field2": 0
},
{
"id": 12,
"parent": 32,
"field0": "GM Opel",
"field1": 0,
"field2": 0
},
{
"id": 13,
"parent": 32,
"field0": "GMAC",
"field1": 0,
"field2": 0
},
{
"id": 14,
"parent": 13,
"field0": "GMAC Insurance",
"field1": 0,
"field2": 0
},
{
"id": 15,
"parent": 0,
"field0": "GSAM",
"field1": 0,
"field2": 0
},
{
"id": 16,
"parent": 29,
"field0": "General Insurance",
"field1": 0,
"field2": 0
},
{
"id": 17,
"parent": 33,
"field0": "Genworth",
"field1": 0,
"field2": 0
},
{
"id": 18,
"parent": 29,
"field0": "AIG",
"field1": 0,
"field2": 0
},
{
"id": 19,
"parent": 29,
"field0": "Andor",
"field1": 0,
"field2": 0
},
{
"id": 20,
"parent": 29,
"field0": "BARCLAYS",
"field1": 92.7731197209214,
"field2": -10.1717767200607
},
{
"id": 21,
"parent": 30,
"field0": "BHHSH",
"field1": 0,
"field2": 0
},
{
"id": 22,
"parent": 30,
"field0": "BHPBFIN",
"field1": 0,
"field2": 0
},
{
"id": 23,
"parent": 31,
"field0": "BHPSTEEUR",
"field1": 1468.80370935,
"field2": -161.395632863801
},
{
"id": 24,
"parent": 31,
"field0": "BHPSUS",
"field1": 0,
"field2": 0
},
{
"id": 25,
"parent": 31,
"field0": "BLUESCOPEFIN",
"field1": 0,
"field2": 0
},
{
"id": 26,
"parent": 29,
"field0": "CSFB",
"field1": 3.35029024626419,
"field2": -0.367366071961442
},
{
"id": 27,
"parent": 29,
"field0": "BLOSOFL",
"field1": 0,
"field2": 0
},
{
"id": 28,
"parent": 29,
"field0": "GRMOBND",
"field1": 0,
"field2": 0
},
{
"id": 29,
"field0": "$ALL$",
"field1": 1564.92711931719,
"field2": -171.934775655824
},
{
"id": 30,
"parent": 34,
"field0": "BHPBGRP",
"field1": 0,
"field2": 0
},
{
"id": 31,
"parent": 34,
"field0": "BHPSTEELGRP",
"field1": 1468.80370935,
"field2": -161.395632863801
},
{
"id": 32,
"parent": 29,
"field0": "GM",
"field1": 0,
"field2": 0
},
{
"id": 33,
"parent": 29,
"field0": "GE",
"field1": 0,
"field2": 0
},
{
"id": 34,
"parent": 29,
"field0": "BHPBMGRP",
"field1": 1468.80370935,
"field2": -161.395632863801
},
{
"id": 35,
"parent": 29,
"field0": "PIMCO",
"field1": 0,
"field2": 0
}
],
"localdata": [
{
"id": 0,
"parent": 29,
"field0": "Goldman",
"field1": 0,
"field2": 0
},
{
"id": 1,
"parent": 29,
"field0": "IBM",
"field1": 0,
"field2": 0
},
{
"id": 2,
"parent": 29,
"field0": "JP Chase",
"field1": 0,
"field2": 0
},
{
"id": 3,
"parent": 34,
"field0": "MINESCONDIDA",
"field1": 0,
"field2": 0
},
{
"id": 4,
"parent": 29,
"field0": "Merrill",
"field1": 0,
"field2": 0
},
{
"id": 5,
"parent": 29,
"field0": "Nokia",
"field1": 0,
"field2": 0
},
{
"id": 6,
"parent": 29,
"field0": "Pequot",
"field1": 0,
"field2": 0
},
{
"id": 7,
"parent": 35,
"field0": "Pimco Fund A",
"field1": 0,
"field2": 0
},
{
"id": 8,
"parent": 35,
"field0": "Pimco Fund B",
"field1": 0,
"field2": 0
},
{
"id": 9,
"parent": 29,
"field0": "Deutsche",
"field1": 0,
"field2": 0
},
{
"id": 10,
"parent": 13,
"field0": "Ditech",
"field1": 0,
"field2": 0
},
{
"id": 11,
"parent": 32,
"field0": "GM Isuzu",
"field1": 0,
"field2": 0
},
{
"id": 12,
"parent": 32,
"field0": "GM Opel",
"field1": 0,
"field2": 0
},
{
"id": 13,
"parent": 32,
"field0": "GMAC",
"field1": 0,
"field2": 0
},
{
"id": 14,
"parent": 13,
"field0": "GMAC Insurance",
"field1": 0,
"field2": 0
},
{
"id": 15,
"parent": 0,
"field0": "GSAM",
"field1": 0,
"field2": 0
},
{
"id": 16,
"parent": 29,
"field0": "General Insurance",
"field1": 0,
"field2": 0
},
{
"id": 17,
"parent": 33,
"field0": "Genworth",
"field1": 0,
"field2": 0
},
{
"id": 18,
"parent": 29,
"field0": "AIG",
"field1": 0,
"field2": 0
},
{
"id": 19,
"parent": 29,
"field0": "Andor",
"field1": 0,
"field2": 0
},
{
"id": 20,
"parent": 29,
"field0": "BARCLAYS",
"field1": 92.7731197209214,
"field2": -10.1717767200607
},
{
"id": 21,
"parent": 30,
"field0": "BHHSH",
"field1": 0,
"field2": 0
},
{
"id": 22,
"parent": 30,
"field0": "BHPBFIN",
"field1": 0,
"field2": 0
},
{
"id": 23,
"parent": 31,
"field0": "BHPSTEEUR",
"field1": 1468.80370935,
"field2": -161.395632863801
},
{
"id": 24,
"parent": 31,
"field0": "BHPSUS",
"field1": 0,
"field2": 0
},
{
"id": 25,
"parent": 31,
"field0": "BLUESCOPEFIN",
"field1": 0,
"field2": 0
},
{
"id": 26,
"parent": 29,
"field0": "CSFB",
"field1": 3.35029024626419,
"field2": -0.367366071961442
},
{
"id": 27,
"parent": 29,
"field0": "BLOSOFL",
"field1": 0,
"field2": 0
},
{
"id": 28,
"parent": 29,
"field0": "GRMOBND",
"field1": 0,
"field2": 0
},
{
"id": 29,
"field0": "$ALL$",
"field1": 1564.92711931719,
"field2": -171.934775655824
},
{
"id": 30,
"parent": 34,
"field0": "BHPBGRP",
"field1": 0,
"field2": 0
},
{
"id": 31,
"parent": 34,
"field0": "BHPSTEELGRP",
"field1": 1468.80370935,
"field2": -161.395632863801
},
{
"id": 32,
"parent": 29,
"field0": "GM",
"field1": 0,
"field2": 0
},
{
"id": 33,
"parent": 29,
"field0": "GE",
"field1": 0,
"field2": 0
},
{
"id": 34,
"parent": 29,
"field0": "BHPBMGRP",
"field1": 1468.80370935,
"field2": -161.395632863801
},
{
"id": 35,
"parent": 29,
"field0": "PIMCO",
"field1": 0,
"field2": 0
}
]
},
"_options": {},
"records": [],
"_downloadComplete": [],
"_bindingUpdate": []
},
"columns": [
{
"dataField": "field0",
"text": "Counterparty"
},
{
"dataField": "field1",
"text": "SUM(CDSStress A:USD 10Y X -1.25)"
},
{
"dataField": "field2",
"text": "SUM(CDSStress A:USD 10Y X 1.25)"
}
]
}
在我的控制器代码中，网格功能:
and in my controller code, the grid function :
function initHierarchyGrid_Generic(reportType, isHierarchy, isDynamic) {
isDynamic = (isDynamic == undefined ? false : isDynamic);
if (isDynamic) {
// in this case we have saved everything to $rootScope
myModel = $rootScope.reptWizard.modelDef;
myColumns = $rootScope.reptWizard.colDefs;
myData = $rootScope.reptWizard.aggrResults;
}
// add Json data onto myModel object; define jqWidgets data adapter
myModel["localData"] = myData;
var dataAdapter = new $.jqx.dataAdapter(myModel);
var ds = {
schema: {
model: myModel
},
pageSize: 10,
data: dataAdapter
};
$scope.jqGridHierObj = {}; // object reference
vm.jqGridHierSettings = { // jqwidgets grid
altrows: true,
width: 600,
height: 300,
source: myData,
columns: myColumns
};
return vm.jqGridHierSettings;
}
*更新*
我的dataAdapter定义似乎导致将localData数据数组嵌套在其对象中.这是我在f12控制台工具中找到localData的地方.一定是错误的:
I seems like my dataAdapter definition is causing the localData data array to be nested in their object. Here's where I found localData in f12 console tools. It must be wrong :
*更新2 * 试图让jsfiddle工作，但是有点麻烦:
* UPDATE 2 * Trying to get a jsfiddle working, but having a bit of trouble :
http://jsfiddle.net/L9530s43/2/
vm.jqGridHierSettings.source._source.source._source.localData
推荐答案
可能的问题是您也没有使用dataAdapter.设置对象的source属性指向myData，而不是dataAdapter
May be the problem is that you do not use dataAdapter, too. The settings object's source property points to myData, not to dataAdapter
这篇关于带有dataAdapter的JQWidgets treegrid无法呈现的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
