首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Ajax >

Extjs Grid 不显示数据,该如何解决

2013-01-04 
ExtjsGrid 不显示数据不显示数据(后台已接受请求,并且回发数据),不提示任何错误确定数据格式以及路径正确J

Extjs Grid 不显示数据
不显示数据(后台已接受请求,并且回发数据),不提示任何错误
确定数据格式以及路径正确
JS如下


var grid;
var record;
var store;
Ext.onReady(function () {
    //后台返回的数据格式是 {total:总页数值,rows:[{},{}]}
    store = new Ext.data.JsonStore({
        url: 'ExtDataModifyShipAddressList.aspx?p=' + Math.random(),
        root: 'rows',
        totalProperty: 'total',
        fields: [
            { name: 'Id' },
            { name: 'Sid' },
            { name: 'Status' },
            { name: 'CustomerID' },
            { name: 'Description' },
            { name: 'ShipAddress' },
            { name: 'StateName' },
            { name: 'CityName' },
            { name: 'ZipCode' },
            { name: 'ContactPerson' },
            { name: 'ContactTel' },
            { name: 'ShipVia' },
            { name: 'Country' },
            { name: 'StId' },
            { name: 'Default'}],
        method: 'post'
    });

    //加载数据
    store.load({
        params: {
            start: 0,
            limit: 20
        }
    }); 

    grid = new Ext.grid.GridPanel({
        frame: true,
        title: 'New Customer Application List',
        stripeRows: true, //斑马线
        store: store,
        applyTo: 'grid', //指定显示数据的div
        trackMouseOver: true,
        height: 550,
        width: window.screen.width - 17, //屏幕分辨率的宽
        loadMask: { msg: 'loading……' },

        columns: [
        new Ext.grid.RowNumberer(), //行号
        {header: '<font size=2>Id</font>', dataIndex: 'Id', sortable: true },


        { header: '<font size=2>Sid</font>', dataIndex: 'Sid', sortable: true },
        { header: '<font size=2>Status</font>', dataIndex: 'Status', sortable: true },
        { header: '<font size=2>CustomerID</font>', dataIndex: 'CustomerID', sortable: true },
        { header: '<font size=2>Description</font>', dataIndex: 'Description', sortable: true },
        { header: '<font size=2>ShipAddress</font>', dataIndex: 'ShipAddress', sortable: true },
        { header: '<font size=2>StateName</font>', dataIndex: 'StateName', sortable: true },
        { header: '<font size=2>CityName</font>', dataIndex: 'CityName', sortable: true },
        { header: '<font size=2>ZipCode</font>', dataIndex: 'ZipCode', sortable: true },
        { header: '<font size=2>ContactPerson</font>', dataIndex: 'ContactPerson', sortable: true },
        { header: '<font size=2>ContactTel</font>', dataIndex: 'ContactTel', sortable: true },
        { header: '<font size=2>ShipVia</font>', dataIndex: 'ShipVia', sortable: true },
        { header: '<font size=2>Country</font>', dataIndex: 'Country', sortable: true },
        { header: '<font size=2>StId</font>', dataIndex: 'StId', sortable: true}],
        //分页
        bbar: new Ext.PagingToolbar({
            pageSize: 20,
            store: store,
            displayInfo: true, //显示分页
            emptyMsg: "NO DATA"
        })
    })

    //底下容器
    var bookTplMarkup = [
'Id: <br/>{Id}<br/><br/>',
        "<input type='button' value='Del' onclick=Del({Id})><br/>"
];
    var bookTpl = new Ext.Template(bookTplMarkup);

    var ct = new Ext.Panel({
        renderTo: 'grid', 
        frame: true,
        title: 'Customer Detailed Info',
        loadMask: { msg: 'loading……' },
        width: window.screen.width - 17,
        height: 500,


        layout: 'border',
        items: [
grid,
{
    id: 'detailPanel',
    region: 'center',
    bodyStyle: {
        background: '#ffffff',
        padding: '7px'
    },
    html: 'Please select a row to see additional details.'
}
]
    })
    grid.getSelectionModel().on('rowselect', function (sm, rowIdx, r) {
        var detailPanel = Ext.getCmp('detailPanel');
        bookTpl.overwrite(detailPanel.body, r.data);
        record = r;
    });

})





[解决办法]
关注,昨天我也出现这个问题了,我的是ExtJS4,用firebug看到JSON返回回来了,可界面上就是没有,现在还没解决,估计是加载刷新时机问题。。。。
[解决办法]
把这行 root: 'rows'删掉试试
[解决办法]
引用:
把这行 root: 'rows'删掉试试

这个貌似是接回来的JSON,把它删了可否?
[解决办法]
后台返回的json格式是正确的,那么错误很可能是出现在页面,或者你没有setContentType,出现在页面的原因,可能是返回的信息里边包含了其他标签内容,要知道,json对这些东西很敏感的,除了返回的数据,其他的可以删就删
[解决办法]
贴出json返回字符串吧!这样大家好帮你调了
[解决办法]
{"keyname":"value"}把json的格式都有双引号试一下。好像高版本的json要求很严格来着。

热点排行