ext + json + struts 2.0 + spring

leonelwong 2008-08-22
在这里,我使用的是ext + json + struts 2.0 + spring 的分页
首先,要使用案例中的分页,必须要注意以下几点 :
1:要导入struts 2.0 的包,还有管理bean的spring的包,最关键的是使用json数据转换的的包jsonplugin-0[1].19.jar
2:配置spring的bean,配置struts.xml如下:
<include file="struts-default.xml" />
<package name="com.skywin.pay.sp" extends="json-default"><!—不是普通的返回路径式的ACTION,这样是确定返回的是JSON数据-->
<action name="sp_Action" class="SP_Action">
<result type="json" /><!—返回的是JSON数据,不是路径-->
</action>
</package>
3:创建ACTION,必须包含以下属性(在前台用于显示数据和分页信息):
// 存储数据的LIST或者是其他集合
private List list;
// 当前第几页
private Integer start = 0;
// 每页多少条记录
private Integer limit = 10;
// 总页数
private Integer totalPage = 0;
// 总记录数
private Integer totalCount = 0;
然后采用JAVABEAN形式,实现getter(),setter()方法
这些属性用于返回JSON数据格式,所以要引用
import com.googlecode.jsonplugin.annotations.JSON;
@JSON(name = "totalCount")
public Integer getTotalCount() {
return totalCount;
}
@JSON(name = "limit")
public Integer getLimit() {
return limit;
}
@JSON(name = "list")
public List getList() {
return list;
}
@JSON(name = "start")
public Integer getStart() {
return start;
}
@JSON(name = "totalPage")
public Integer getTotalPage() {
return totalPage;
}
4:前台显示
Ext.onReady(function(){ 
    // create the Data Store   
    var spInfo_store = new Ext.data.Store({
        proxy: new Ext.data.HttpProxy({
            url: 访问的url,
            method: 'post'
        }),
        // create reader that reads the Topic records
        reader: new Ext.data.JsonReader({//用jsonReader读取这些数据
            root: 'list',//返回的集合
            totalProperty: 'totalCount',//总记录数
            id: 'Id',//对象的ID
            fields: [
            //默认类型为String
            {name: '属性名'}
            ]
        }),
        remoteSort: false
    });
    spInfo_store.setDefaultSort('Id', 'asc');//数据排序方式
    // the data store
//数据添加checkbox
  var sm = new Ext.grid.CheckboxSelectionModel();
//数据绑定列
    var cm = new Ext.grid.ColumnModel([sm,{
   id:"spInfo_Id",//新增这个ID,用于标识
           header: "SP代码",
           dataIndex: 'sp_Id',
           width: 150
},{
   id:"spInfo_Name",
           header: "SP名称",
   dataIndex: 'sp_Name',
           width: 150
        }
]);
    cm.defaultSortable = true;

    spInfo_grid = new Ext.grid.GridPanel({
    title:'所有SP信息如下:',
        el:'grid_Div ',
    id:'spInfo-loadgrid',
        width:800,
        height:450,
border:true,
        store: spInfo_store,
        cm: cm,
        trackMouseOver:false,
        sm: sm,
        loadMask: true,
        selModel: new Ext.grid.RowSelectionModel({singleSelect:true}),  
        enableColLock:false,  
        viewConfig: {
        forceFit:true
        },
        bbar: new Ext.PagingToolbar({
            pageSize: 10,
            store: spInfo_store,//数据存储
            displayInfo: true,
            displayMsg: '当前第 {0} - {1} 条记录 / 共 {2} 条',
            emptyMsg: "找不到相关数据",
            items:[
            '-', {
                text: '功能', //测试事件
                handler:function(){
               Ext.MessageBox.alert(‘功能’);
                }
            }]
        })
    });

 
   spInfo_store.load({params:{start:0, limit:10}});
});
<div id=”grid_Div”></div>//GRID容器,用于存放数据 和列信息
erichua 2008-08-23
Json——plugin在使用中会有问题的。如“【】”的问题。其实用spring的json_view更简单和有效。
Global site tag (gtag.js) - Google Analytics