JQWidgets treegrid with dataAdapter not rendering

2019-09-02 04:43发布

站内问答 / 后端开发
1096 1 5

I'm in the AngularJS environment, and trying to get a jqWidgets TreeGrid working.

I have the dataAdapter all wired up with the Json formatted data, however the grid renders empty data but shows columns (see attached image).

I'm using this non Angular-based demo as a guide to wire up the dataAdapter:

http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxtreegrid/index.htm#demos/jqxtreegrid/javascript-tree-grid-binding-to-json.htm

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

Here's the html snippet:

 <div class="widget-content user">
    <jqx-treegrid jqx-instance="jqGridHierObj" jqx-settings="vm.jqGridHierSettings">
    </jqx-treegrid>
 </div>

Here's what my treegrid settings look like, complete with data and model.

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;
}

* UPDATE *

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 :

* UPDATE 2 * Trying to get a jsfiddle working, but having a bit of trouble :

http://jsfiddle.net/L9530s43/2/

nested localData

     vm.jqGridHierSettings.source._source.source._source.localData

empty tree grid

标签： jqwidget
举报
1条回答
不美不萌又怎样
2楼-- · 2019-09-02 05:10

May be the problem is that you do not use dataAdapter, too. The settings object's source property points to myData, not to dataAdapter

查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(5)