+ -
当前位置:首页 → 问答吧 → extjs PagingToolbar分页不显示内容,请教

extjs PagingToolbar分页不显示内容,请教

时间:2010-11-26

来源:互联网

代码如下,没有报错,但是grid中没有显示任何数据,但是我觉得我的数据绝对没有组错,到底哪里出了问题。贴上全代码,求助。

JScript code

Ext.onReady(function(){      
    var xg = Ext.grid;
    var reader = new Ext.data.ArrayReader({}, 
    [
       {name: 'company'},
       {name: 'price', type: 'float'},
       {name: 'change', type: 'float'},
       {name: 'pctChange', type: 'float'},
       {name: 'lastChange', type: 'date', dateFormat: 'n/j h:ia'},
       {name: 'desc'}
    ]);

    var store =  new Ext.data.Store({
        reader: reader,
    totalProperty:'total',
    root:'data',
        proxy: new Ext.data.HttpProxy({
         url: 'http://localhost/extdemo/1.jsp'
    })
    });
  
    var grid1 = new xg.GridPanel({
        width: 600,
        height: 300,
        collapsible: false,
        animCollapse: false,
        title: 'xxxxxxxxxx',
        iconCls: 'icon-grid',
        enableHdMenu: false,
        loadMask: true,

        store:store,
        
        cm: new xg.ColumnModel([
            new xg.RowNumberer(), 
            {id:'company',header: "Company", width: 40, sortable: false, dataIndex: 'company'},
            {header: "Price", width: 20, sortable: false, renderer: Ext.util.Format.usMoney, dataIndex: 'price'},
            {header: "Change", width: 20, sortable: false, dataIndex: 'change'},
            {header: "% Change", width: 20, sortable: false, dataIndex: 'pctChange'},
            {header: "Last Updated", width: 20, sortable: false, renderer: Ext.util.Format.dateRenderer('m/d/Y'), dataIndex: 'lastChange'}
        ]),
        viewConfig: {
            forceFit:true,
            enableRowBody:true,            
            showPreview:true,            
            getRowClass : function(record, rowIndex, p, store){         
                if(this.showPreview){
                    p.body = '<p>'+record.data.excerpt+'</p>';
                    return 'x-grid3-row-expanded';
                }                 
                return 'x-grid3-row-collapsed';
            }
        },
    bbar: new Ext.PagingToolbar({             
                    pageSize: 10,            
                    store: store,        
                    displayInfo: true,            
                    displayMsg: 'Displaying topics {0} - {1} of {2}',           
                    emptyMsg: "No topics to display"  
                })
    });
    grid1.render("topic-grid");
    store.load({params:{start:0, limit:10}}); 
});



1.jsp
HTML code

<%
        request.setCharacterEncoding("utf-8");
        String _start = request.getParameter("start");
        String _limit = request.getParameter("limit");
        int start = Integer.parseInt(_start);
        int limit = Integer.parseInt(_limit);

        String responseString = "{'total':30,'data':[";
        for(int i=0; i<limit; i++){
             responseString+= ("['company"+i+start+"',"+i+start+".01,"+i+start+".02,"+i+start+".03,'9/1 0"+i+":"+start+"0am','yyy"+i+start+"']");
             if(i!=limit-1){
                     responseString+= ","; 
             }
        }
        responseString+="]}";
        
        System.out.println(responseString);
        response.setCharacterEncoding("utf-8");
        response.setContentType("text/html;charset=utf-8");
        response.getWriter().write(responseString);
        response.flushBuffer();
        response.getWriter().close();
%>



我在地址栏输入http://127.0.0.1/extdemo/1.jsp?start=0&limit=10返回字符为
{'total':30,'data':[['company00',00.01,00.02,00.03,'9/1 00:00am','yyy00'],['company10',10.01,10.02,10.03,'9/1 01:00am','yyy10'],['company20',20.01,20.02,20.03,'9/1 02:00am','yyy20'],['company30',30.01,30.02,30.03,'9/1 03:00am','yyy30'],['company40',40.01,40.02,40.03,'9/1 04:00am','yyy40'],['company50',50.01,50.02,50.03,'9/1 05:00am','yyy50'],['company60',60.01,60.02,60.03,'9/1 06:00am','yyy60'],['company70',70.01,70.02,70.03,'9/1 07:00am','yyy70'],['company80',80.01,80.02,80.03,'9/1 08:00am','yyy80'],['company90',90.01,90.02,90.03,'9/1 09:00am','yyy90']]}

作者: qq1212   发布时间: 2010-11-26

CSS code


var store = new Ext.data.JsonStore({
    totalProperty:'total',
    root:'data',
    proxy: new Ext.data.HttpProxy({
    url: 'http://localhost/extdemo/1.jsp'
 
    fields: [
       {name: 'company'},
       {name: 'price', type: 'float'},
       {name: 'change', type: 'float'},
       {name: 'pctChange', type: 'float'},
       {name: 'lastChange', type: 'date', dateFormat: 'n/j h:ia'},
       {name: 'desc'}
     ]
});
用json store 看看效果

作者: leehuat   发布时间: 2010-11-26

我看到网上很多例子也都是用json的 但是我很奇怪为什么我自己组的就不行?难道分页只支持json的类型吗?

请帮帮看看是否我组的数组有问题还是代码哪里写错了

作者: qq1212   发布时间: 2010-11-26

热门下载

更多