how to display the data in the gridPanel?

[zhangyonghui]

I use the gridPanel to display the data dynamically,but the data can not display.I don't kown why!So,please help me.
There are my code.

Ext.namespace("com.branchitech.taskmanager");

/**
 *    通过标签查找的数据的显示界面
 */
com.branchitech.taskmanager.DatasByTagsDisplay = function(config){
    config = config || {};
    config = this._initConfig(config);
    com.branchitech.taskmanager.DatasByTagsDisplay.superclass.constructor.call(this,config);
};

Ext.extend(com.branchitech.taskmanager.DatasByTagsDisplay,Ext.grid.GridPanel,{
    //初始化配置
    _initConfig : function(config){
        var defaultConfig = this._initDefaultConfig();
        Ext.applyIf(config,defaultConfig);//复制默认配置到初始化配置中
        return config;
    },
    
    //初始化默认配置
    _initDefaultConfig : function(){
        var sm = this._initSm();
        var store = this._initStore();
        var columns = this._initColumns();
        var buttons = this._initButtons();
        var pageBar = this._initPageBar(store);
        var defaultConfig = {
            id : "DATAS-PANEL",//id名
            viewConfig : {     //视图配置
                forceFit: true,
                deferEmptyText: true, 
                emptyText : "<font color = 'red'>没有相应数据</font>"
            },
            autoScroll : true,//下拉条
            autoSizeColumns : true,//自动调节列宽
            autoHeight : true,//自动调节高度
            //height : 400,
            //autoExpandColumn : "data",
            sm : sm,
            store : store,
            cm : columns,
            tbar : buttons,
            bbar : pageBar
        };
        return defaultConfig;
    },
    
    //初始化sm
    _initSm : function(){
        var sm = new Ext.grid.RowSelectionModel({
            singleSelect : true
        });
        return     sm;
    },
    
    //初始化store
    _initStore : function(){
        return com.branchitech.taskmanager.dataStore;
    },
    
    //初始化column
    _initColumns : function(){
        var columns = new Ext.grid.ColumnModel([
            {header: "数据标题", width: 200, sortable: true, dataIndex: 'title'},
            {header: "数据描述", width: 400, sortable: true, renderer: this.formatDescription, dataIndex: 'description'},
            {header: "数据来源系统", width: 200, sortable: true, dataIndex: 'source'}
            //{header: "操作标签", width: 200, sortable: true}
        ]);
        return columns;
    },
    
    //初始化工具条上的按钮
    _initButtons : function(){
        var buttons = [];
        var button1 = new Ext.Button({
            text : "button1"
        }); 
        buttons.push(button1);
        return buttons;
    },
    //初始化分页工具条
    _initPageBar : function(store){
        var pageBar = new Ext.PagingToolbar({
                store : store,
                    pageSize : 6,
                    displayInfo : true,
                    displayMsg : "显示从{0}条数据到{1}条数据，共{2}条数据",
                    emptyMsg : "没有记录"
         })
         return pageBar;
    },
    
    //格式化数据的描述信息，只显示50个长度的字符
    formatDescription : function(description){
        alert(description);
    }
});

com.branchitech.taskmanager.dataRecord = Ext.data.Record.create([
    {
        name : 'title',
        type : "String"
    },
    {
        name : 'description',
        type : "String"
    },
    {
        name : 'source',
        type : "String"
    }
]);

com.branchitech.taskmanager.dataStore = new Ext.data.JsonStore({
    autoLoad : true,
    proxy : new Ext.data.HttpProxy(
        {
            url : "../test/json/datas.json"
        }
    ),
    reader: new Ext.data.JsonReader(
        {
            'totalProperty': "results",
              root: "rows"
        }, 
        com.branchitech.taskmanager.dataRecord
    )
});

the datas.json is:

{
    'results' : 2,
    'rows' : [
        {'title': '新建会议','description': '新建一个会议','source' : '日常工作管理'},
        {'title': '新建项目','description': '新建一个项目','source' : '日常工作管理'}
    ]
}

[Condor]

1. type:'String' is not a valid type. You want type:'string' (small s).
2. JsonStore doesn't have a reader config option. You want a normal Ext.data.Store.

[zhangyonghui]

Yes,you are right. The Ext.data.JsonStore does not have a reader config option and a proxy config option.The reader config option is instead of "totalProperty"、"root"、"fields" config option,and the url option is instead of the proxy config option.So there are the correct code.See below.
Ext.namespace("com.branchitech.taskmanager");
/**
* 通过标签查找的数据的显示界面
*/
com.branchitech.taskmanager.DatasByTagsDisplay = function(config){
config = config || {};
config = this._initConfig(config);
com.branchitech.taskmanager.DatasByTagsDisplay.superclass.constructor.call(this,config);
};
Ext.extend(com.branchitech.taskmanager.DatasByTagsDisplay,Ext.grid.GridPanel,{
//初始化配置
_initConfig : function(config){
var defaultConfig = this._initDefaultConfig();
Ext.applyIf(config,defaultConfig);//复制默认配置到初始化配置中
return config;
},

//初始化默认配置
_initDefaultConfig : function(){
var sm = this._initSm();
var store = this._initStore();
var columns = this._initColumns();
var buttons = this._initButtons();
var pageBar = this._initPageBar(store);
var defaultConfig = {
id : "DATAS-PANEL",//id名
el : "dataList",
viewConfig : { //视图配置
forceFit: true,
deferEmptyText: true,
emptyText : "<font color = 'red'>没有相应数据</font>"
},
autoScroll : true,//下拉条
autoSizeColumns : true,//自动调节列宽
autoHeight : true,//自动调节高度
//height : 400,
sm : sm,
store : store,
cm : columns,
tbar : buttons,
bbar : pageBar
};
return defaultConfig;
},

//初始化sm
_initSm : function(){
var sm = new Ext.grid.RowSelectionModel({
singleSelect : true
});
return sm;
},

//初始化store
_initStore : function(){
return com.branchitech.taskmanager.dataStore;
},

//初始化column
_initColumns : function(){
var columns = new Ext.grid.ColumnModel([
new Ext.grid.RowNumberer(),
{header: "数据标题",sortable: true, dataIndex: 'title'},
{header: "数据描述",sortable: true, renderer: this.formatDescription, dataIndex: 'description'},
{header: "数据来源系统", sortable: true, dataIndex: 'source'}
//{header: "操作标签", width: 200, sortable: true}
]);
return columns;
},

//初始化工具条上的按钮
_initButtons : function(){
var buttons = [];
var button1 = new Ext.Button({
text : "button1"
});
buttons.push(button1);
return buttons;
},

//初始化分页工具条
_initPageBar : function(store){
var pageBar = new Ext.PagingToolbar({
store : store,
pageSize : 6,
displayInfo : true,
displayMsg : "显示从{0}条数据到{1}条数据，共{1}条数据",
emptyMsg : "没有记录"
})
return pageBar;
},

//格式化数据的描述信息，只显示50个长度的字符
formatDescription : function(description){
description = description.substr(0,50);
//description = description.substring() + "...";
if(description.length >= 50){
description = description + "..."
}
return description;
}
});
com.branchitech.taskmanager.dataStore = new Ext.data.JsonStore({
autoLoad : true,
url : "../test/json/datas.json",
//'totalProperty': "results",
root: "rows",
fields : [
{
name : "title",
type : "string"
},
{
name : "description",
type : "string"
},
{
name : "source",
type : "string"
}
]
});