日期:2014-05-16  浏览次数:20321 次

EXTJs 4 中采用AJAX 分页问题记录

直接上项目中出现问题的界面图,如下:、

?



在界面中设置的pageSize = 12,本想应该分页显示的,但是显示出来的却不是每页12条,而是一个页就显示了整个数据,看了很久了前台代码,发现没什么问题啊,具体前台代码如下:

?

?

    // create the data store
    var store = Ext.create('Ext.data.Store', {
        model: 'Company',
        //remoteSort: true,//加了就不能在页面手动排序了
        pageSize :limit,
		proxy : {
			type : 'ajax',
			url : '${path}/test/pBarGrid/jsonData.action',
			//type: 'pagingmemory',
            //data: myData,
			reader : {
				type : 'json',
				root : 'items',
				totalProperty : 'totalCount'
			},writer : {  
            	type:'json'  
        	}  
		},
		autoLoad : true
    });

?
?如果采用?type: 'pagingmemory',data: myData 类型 是可以正常分页的,一个人想了老半天,还是没结果,最后还是老大解了我的疑惑,这种分页问题不出在前台,而是在后台,因为EXT 的store中提供了两个属性值,一个start(开始值),另一个是limit(当前页面显示记录数),在后台必须根据这两个属性的值来做数据的处理,具体如下:

?

?

  得到分页组件的两个属性值
		int start = Integer.parseInt(getParamter("start"));
		int limit = Integer.parseInt(getParamter("limit"));

?

? ?然后对数据进行处理,只传显示需要展示的部分,不要全部传到前台。

?

	public void refreshPageData(){
		if(list != null && list.size() >0){
			if(list.size() > start){
				int size = list.size();
				int end = start + limit;
				if(end >size){
					end = size;
				}
				list = list.subList(start, end);//截取数据源
			}
		}
	}
?