Question

请欣赏一些帮助解决这个问题。所以我有以下代码将Json数据加载到Jquery网格.... jqxTreegrid。到目前为止，网格显示但数据没有显示。此外，调试器显示我没有任何错误。所以，我很感激任何帮助来解决这个问题。

$(document).ready(function () {
    // prepare the data
    var source =
    {
        dataType: "json",
        dataFields: [
            { name: 'sid', type: 'string' },
            { name: 'id', type: 'string' },
            { name: 'position', type: 'string' },
            { name: 'created_at', type: 'string' },
            { name: 'created_meta', type: 'number' },
            { name: 'updated_at', type: 'string' }, 
            { name: 'updated_meta', type: 'string' },
            { name: 'meta_data', type: 'string' }, 
            { name: 'community_area_number', type: 'number' },
            { name: 'community_area_name', type: 'string' }


        ],
        hierarchy:
        { 
           root: 'sid'

        },
          id: 'sid',
        //url: 'http://www.filedropper.com/employeesadv'
        //url: 'gdiChicago/employeesadv.csv'
        url: 'data.cityofchicago.org_Births-to-mothers-aged-15_19_kva-bt6k.json'
    }; 
    var dataAdapter = new $.jqx.dataAdapter(source);

    $("#content").on('rowselect', function(event){
            // event arguments
        var args = event.args;
        // row data
        var rowData = args.row;
        // row key
        var rowKey = args.key;
        console.log('RowSelect selected');
        event.stopPropagation();
        });

     $("#content").on('bindingComplete', function(event)
        {
            $("#content").jqxTreeGrid('hideColumn', 'name');
            console.log('Tree successfully loaded');
        });

    $("#content").on('beforeLoadComplete', function (records) {
        var data = new Array();
        // update the loaded records. Dynamically add EmployeeName and EmployeeID fields. 
        for (var i = 0; i < records.length; i++) {
            var employee = records[i];
            console.log(employee);
        } 
    });

    // create Tree Grid
    $("#content").jqxTreeGrid(
    {
        width: 1000,
        source: dataAdapter, 
        pageable: true,
        columnsResize: true,
        ready: function()
        {
            // expand row with 'EmployeeKey = 32'
            $("#content").jqxTreeGrid('expandRow', 32);
        },
        columns: [ 
           { text: 'sid', dataField:  'sid', minWidth: 100, width: 300 },
           { text: 'id', dataField:'id', minWidth: 100, width: 300 },
           { text: 'position', dataField:'position', minWidth: 100, width: 300 },
           { text: 'created at', dataField:  'created_at' , minWidth: 100, width: 300 },
           { text: 'created meta', dataField:  'created_meta' , minWidth: 100, width: 300 },
           { text: 'updated at', dataField:  'updated_at', minWidth: 100, width: 300 },
           { text: 'updated meta', dataField:'updated_meta', minWidth: 100, width: 300 },
           { text: 'meta', dataField:'meta', minWidth: 100, width: 300 },
           { text: 'Community Area Number', dataField:  'community_area_number' , minWidth: 100, width: 300 }, 
           { text: 'community area name', dataField:  'community_area_name', minWidth: 100, width: 300 }           

        ]
    });

});

我尝试加载的json数据源可以通过此链接Public Health Statistics - Births to mothers aged 15-19 years old in Chicago, by year, 1999-2009

获取

Answer 1

而不是使用

hierarchy:
{ 
  root: 'sid'    
},

尝试使用

hierarchy:
     { 
        keyDataField: { name: 'sid' }        
     },

JQxTreeGrid已正确呈现，但未从json源加载数据

1 个答案: