Extjs 商店不填充网格线答案

【问题标题】：Extjs store don't fill grid linesExtjs 商店不填充网格线
【发布时间】：2014-02-11 03:16:02
【问题描述】：

你可以看到我关于网格的代码。在这里，窗口打开，但我的网格中没有任何值。能否请你帮忙？

我的 php 返回JSON 编码打击：

{"results":3,"disPath":"","success":"true","rows":[{"id":"1","faz":"Faz1"},{"id":"2","faz":"Faz2"},{"id":"3","faz":"Faz3"}]}

代码

Ext.define('MyDesktop.GridFazlar', {
    extend: 'Ext.ux.desktop.Module',

requires: [
    'Ext.data.ArrayStore',
    'Ext.util.Format',
    'Ext.grid.Panel',
    'Ext.grid.RowNumberer'
],

id:'grid-fazlar',

init : function(){
    this.launcher = {
        text: 'Fazlar',
        iconCls:'icon-grid'
    };
},



createWindow : function(){
    var desktop = this.app.getDesktop();
    var win = desktop.getWindow('grid-fazlar');
    if(!win){

        var fazlarGridStore = new Ext.data.JsonStore({
            root: 'rows',
            autoLoad: true,
            totalProperty: 'results',
            remoteSort: true,
            proxy: new Ext.data.HttpProxy({
                url: 'phps/gridPhasesLoader.php',
                actionMethods: {
                    create : 'POST',
                    read   : 'POST',
                    update : 'POST',
                    destroy: 'POST'
                },
           }),
            baseParams:{
                depth: '2',
                parentId: '2',
                proccess: 'callGrid',
            },
            fields: [{
                name :'id'
            },{
                name :'faz'
            },
            //{
            ]
        });

        win = desktop.createWindow({
            id: 'grid-fazlar',
            title:'Fazlar',
            width:740,
            height:480,
            iconCls: 'icon-grid',
            animCollapse:false,
            constrainHeader:true,
            layout: 'fit',
            listeners:{ 
                beforeshow: function(){
                            fazlarGridStore.proxy.extraParams = {
                                depth: '2',
                                parentId: '2',
                                proccess: 'callGrid',
                            };
                }            
            },   
            items: [
                {   
                    border: false,
                    xtype: 'grid',
                    listeners: {
                        celldblclick : function() {
                            alert('Deneme');    

                        },

                    },


                    contextMenu: new Ext.menu.Menu({
                        items:[
                            {
                            id:'grid-fazlar_menu_denemebutton',
                            text: 'DenemeButonu',
                            listeners: {
                                click: function(){
                                    alert('sssss');
                                }
                            }


                            }
                        ]
                    }),
                    store:fazlarGridStore,
                    columns: [
                        new Ext.grid.RowNumberer(),
                        {
                            text: "ID",
                            //flex: 1,
                            width: 70,
                            sortable: true,
                            dataIndex: 'id'
                        },{
                            text: "Faz",
                            //flex: 1,
                            width: 70,
                            sortable: true,
                            dataIndex: 'faz'
                        },
                                               ]
                }
            ],
            tbar:[{
                text:'Add Something',
                tooltip:'Add a new row',
                iconCls:'add'
            }, '-', {
                text:'Options',
                tooltip:'Modify options',
                iconCls:'option'
            },'-',{
                text:'Remove Something',
                tooltip:'Remove the selected item',
                iconCls:'remove'
            }]
        });
    }
    return win;
},

statics: {
    getDummyData: function () {
        return [
            ['Faz1','06/06/2011','15/08/2010','19/12/2010'],
            ['Faz2','01/10/2010','15/11/2010','29/11/2011'],
            ['Faz3','16/11/2010','16/12/2010','14/02/2011'],
            ['Faz4','19/03/2011','20/03/2011','18/06/2011'],
            ['Faz5','21/03/2011','20/05/2011','18/08/2011'],
            ['Faz6','21/05/2011','05/07/2011','18/09/2011'],
            ['Faz7','06/07/2011','04/09/2011','06/12/2011'],
            ['Faz8','30/09/2011','30/10/2011','29/12/2011'],

        ];
    }
}
});

【问题讨论】：

标签： grid extjs4

【解决方案1】：

您的 Json 有一个自定义根：'rows'。您必须配置您的数据读取器以考虑到这一点：

proxy: {
    type: 'ajax',
    url: 'phps/gridPhasesLoader.php',
    actionMethods: {
        create : 'POST',
        read   : 'POST',
        update : 'POST',
        destroy: 'POST'
    },
    reader: {
        type: 'json',
        root: 'rows'
    }
},

【讨论】：

非常感谢，您的解决方案解决了我的问题。