Question

我无法按原样显示动态树形网格 - 网格后面的数据正常工作，我可以看到结果打印到FireBug控制台。然而，它们都没有在ExtJS树网格中显示，除了已在商店中静态设置的Root节点之外没有。

观点：

Ext.define('TS.view.file.archives.raGrid', {
    extend: 'Ext.tree.Panel',
    alias: 'widget.ramaingridpanel',

    id: 'raGrid',
    autoScroll: true,
    store: 'file.archives.Resources',
    layout: {
        type: 'hbox',
        align: 'top',
        pack: 'start'
    },
    columns: [{
        xtype: 'treecolumn',
        id: 'raGridResourceName',
        flex: 2,
        dataIndex: 'text',
        width: 100,
        hideable: false,
        groupable: false,
        text: 'Name',
        editor: {
            xtype: 'textfield'
        }
    }, {
        xtype: 'templatecolumn',
        id: 'raGridResourceIcon',
        tpl: new Ext.XTemplate('<div id="{iconCls}" class="{iconCls}" role="presentation">&nbsp;</div>').html,
        flex: 0.1,
        dataIndex: 'iconCls',
        hideable: false,
        groupable: false,
        editor: {
            xtype: 'combobox',
            store: Ext.data.StoreManager.lookup('file.archive.ResourceIcons')
        }
    }, {
        xtype: 'datecolumn',
        id: 'raGridDate',
        flex: 1,
        dataIndex: 'updated',
        hideable: false,
        groupable: false,
        text: 'Updated'
    }, {
        xtype: 'gridcolumn',
        id: 'raGridPurchasingUnit',
        flex: 1,
        dataIndex: 'purchasedUnit',
        groupable: false,
        text: 'Unit',
        editor: {
            xtype: 'textfield'
        }
    }, {
        xtype: 'numbercolumn',
        id: 'raGridCost',
        flex: 1,
        dataIndex: 'purchasedCost',
        groupable: false,
        text: 'Cost excl. VAT',
        editor: {
            xtype: 'textfield'
        }
    }, {
        xtype: 'numbercolumn',
        id: 'raGridDiscount',
        dataIndex: 'purchasedDiscount',
        flex: 1,
        groupable: false,
        text: 'Discount %',
        editor: {
            xtype: 'textfield'
        }
    }, {
        xtype: 'gridcolumn',
        id: 'raGridEstimatingUnit',
        flex: 1,
        dataIndex: 'estimateUnit',
        groupable: false,
        text: 'Unit',
        editor: {
            xtype: 'textfield'
        }
    }, {
        xtype: 'numbercolumn',
        id: 'raGridAddOn',
        flex: 1,
        dataIndex: 'profitAddOn',
        groupable: false,
        text: 'Mark-up %',
        editor: {
            xtype: 'textfield'
        }
    }, {
        xtype: 'numbercolumn',
        id: 'raGridLanded',
        flex: 1,
        dataIndex: 'landedCost',
        groupable: false,
        text: 'Landed cost',
        editor: {
            xtype: 'textfield'
        }
    }, {
        xtype: 'numbercolumn',
        id: 'raGridCostPrice',
        flex: 1,
        dataIndex: 'number',
        groupable: false,
        text: 'Costprice',
        editor: {
            xtype: 'textfield'
        }
    }, {
        xtype: 'numbercolumn',
        id: 'raGridUnitCorrelation',
        flex: 1,
        dataIndex: 'unitCorrelation',
        groupable: false,
        text: 'Prch./Est.',
        editor: {
            xtype: 'textfield'
        }
    }, {
        xtype: 'numbercolumn',
        id: 'raLeadTime',
        flex: 1,
        dataIndex: 'leadTime',
        groupable: false,
        text: 'Leadtime',
        editor: {
            xtype: 'textfield'
        }
    }, {
        xtype: 'gridcolumn',
        id: 'raGridClass',
        flex: 1,
        dataIndex: 'ResourceClassShortname',
        groupable: false,
        text: 'Class',
        editor: {
            xtype: 'textfield'
        }
    }, {
        xtype: 'gridcolumn',
        id: 'raGridSupplier',
        flex: 1,
        dataIndex: 'supplierName',
        groupable: false,
        text: 'Supplier',
        editor: {
            xtype: 'textfield'
        }
    }],
    viewConfig: {
        id: 'raGridView'
    },
    plugins: [{
        ptype: 'rowediting',
        autoCancel: false,
        clicksToEdit: 2
    }, {
        ptype: 'gridviewdragdrop',
        ddGroup: 'raDdGroup'
    }]
});

商店：

Ext.define('TS.store.file.archives.Resources', {
    extend: 'Ext.data.TreeStore',
    alias: 'store.file.archives.Resources',

    model: 'TS.model.file.archives.Resources',
    autoLoad: false,
    proxy: {
        type: 'ajax',
        url: 'index.php/ajax/resources/',
        reader: {
            type: 'json',
            root: 'results',
            successProperty: 'success',
            totalProperty: 'total'
        }
    },
    root: {
        text: 'Resources',
        id: 'myResources',
        expanded: true,
        children: {}
    }
});

模特：

Ext.define('TS.model.file.archives.Resources', {
extend : 'Ext.data.Model',
alias : 'model.file.archives.Resources',

fields : [ {
    name : 'id',
    type : 'int'
}, {
    name : 'parent_id',
    type : 'int'
}, {
    name : 'child_id',
    type : 'int'
}, {
    name : 'text',
    type : 'string'
}, {
    name : 'updated',
    type : 'date'
}, {
    name : 'purchasedUnit',
    type : 'string'
}, {
    name : 'purchasedCost',
    type : 'double'
}, {
    name : 'purchasedDiscount',
    type : 'double'
}, {
    name : 'estimateUnit',
    type : 'string'
}, {
    name : 'profitAddOn',
    type : 'string'
}, {
    name : 'addonManager',
    type : 'string'
}, {
    name : 'landedCost',
    type : 'double'
}, {
    name : 'unitCorrelation',
    type : 'double'
}, {
    name : 'leadTime',
    type : 'string'
}, {
    name : 'ResourceClassShortname',
    type : 'string'
}, {
    name : 'supplierName',
    type : 'string'
}, {
    name : 'iconCls',
    type : 'string'
}, {
    name : 'ClientSessionId',
    type : 'string'
} ]
});

JSON数据：

({
    "success":"true", 
    "total":"1", 
    "results":
    [{
        "id":0,
        "parent_id":0,
        "child_id":2,
        "text":"Gravemaskiner",
        "updated":1339079129,
        "purchasedUnit":"",
        "purchasedCost":0,
        "purchasedDiscount":0,
        "estimateUnit":"",
        "profitAddOn":"",
        "landedCost":0,
        "unitCorrelation":0,
        "leadTime":"",
        "ResourceClassShortname":"",
        "supplierName":"",
        "iconCls":"iconFolder",
        "leaf":false,
        "children":...

如果有人会如此善意地指出我的代码有什么问题会很棒，

-G。

使用ExtJS 4.0.7

更新：2012-06-19

经过多次测试，这个错误似乎与它有关，但我不确定它意味着什么以及如何解决它：

records[i] is undefined /extjs/ext-all-dev.js Line 88068

已将对象打印到控制台，并清楚地显示商店中的数据。

Answer 1

您的读者需要像这样定义：

reader : {
    type : 'json',
    root : 'children',
    successProperty : 'success',
    totalProperty : 'total'
}

您的json root应该从results更改为children。

Answer 2

Sencha支持回复了以下内容：

树未正确加载的原因是因为json对要摘要的树无效。

问题在于JSON - 它是如何生成的：

// I used this:
$result[$i] = $newArray;

// To fix I had to use this to generate the JSON
array_push($result,$newArray);

和

我注意到你的原始json，它被包裹在“（）”中，这是不正确的。

ExtJS 4.0.7：树形网格未显示

2 个答案: