首页 > 代码库 > easyUI之datagrid 及struts2如何配置
easyUI之datagrid 及struts2如何配置
datagrid可以说是easyUI最重要的一个控件。下面我们来看看它有哪些功能,以及如何来实现。
$('#firmresult').datagrid({ singleSelect:true,//设置只能选择单选 pagination:true,//显示分页 // fit:true,//自动土适应父容器的大小 fitColumns:true,//列宽的自动适应 rownumbers: true,//显示第几行 pageList:[5,10,15],//每页显示记录条数 pageNumber:1,//当前第几页 pageSize:10,//当前每页的大小 height:300,//高度 // url:"firmManager.action", columns:[[//每列上的属性、名称设置 {field:'userId',checkbox:true}, {field:'devId',title:'设备ID',formatter:function(value,rowData,rowIndex){ var devId=rowData.userId; return devId; } }, {field:'snStart',title:'snStart'}, {field:'snEnd',title:'snEnd'}, {field:'registerDate',title:'注册时间'} ]] });datagrid初始化好后,我们不得不说一下我们如何将数据在datagrid中显示出来。
首先来看一下struts2中配置是如何配置的。如果要struts支持josn格式有两种方式:
1.直接继承支持json的配置
2.在配置文件中我们设置拦截器
我们选用第二种方式,当然必要的jar包是必不可少的。见如下配置
<result-types> <span style="white-space:pre"> </span><result-type name="json" class="org.apache.struts2.json.JSONResult"/> </result-types> <interceptors> <interceptor name="json" class="org.apache.struts2.json.JSONInterceptor"/> </interceptors> <action name="firmInfoManager" class="com.dbstar.uaas.firmmng.action.FirmRegisterManagerAction" method="searchFirmInfos"> <result type="json" > <param name="root">result</param><!--这里比较关键,action必须要有result属性的json对象--> </result> </action>
这样配置好后,我们再来看一下如何将查询的数据在datagrid中分页显示出来,有同学可能遇到查出来的结果怎么在第一页就全部显示出来。可能遇到的问题是你虽然设置了分页,但是你将所有的记录都查寻出来了,当然这样也有解决办法,你可以使用前端分页。但是我们这里使用的是后端分页,也就是每页显示几条记录我就查询多少条记录并将其放入josn对象中。
// 查询 function subSerach() { var startDate = $("#startDate").datebox('getValue'); var endDate = $("#endDate").datebox('getValue'); var firmId = $("#firmId").val(); var userType = $("#userType").combobox('getValue'); if(startDate == '') { $.messager.alert('Warning','请输入开始日期。'); $("#startDate").focus(); return; } if(endDate == '') { $.messager.alert('Warning','请输入结束日期。'); $("#endDate").focus(); return; } if(startDate > endDate) { $.messager.alert('Warning','结束日期应不小于开始日期。'); $("#endDate").focus(); return; } var grid = $('#firmresult'); //这个地方很关键,是分页的关键地方。这里我们获娶分页的一些属性,如第几页、每页显示多少条记录等 var options = grid.datagrid('getPager').data("pagination").options; var num = options.pageNumber; var size = options.pageSize; var params = {//这里的参数是我们传到后台的查询条件,后台我们使用的是一个查询条件的对象,以及用于分页的对象 'firmQueryBean.startDate':startDate,'firmQueryBean.endDate':endDate, 'firmQueryBean.firmId':firmId,'firmQueryBean.userType':userType, 'pagination.pageNo':num,'pagination.pageSize':size }; $.post("firmInfoManager.action", params,//通过ajax的方式提交表单 function(data){ if(data && data.reusltList){ var ret=[]; var json = data.reusltList; var atotal = data.counts; for(var i=0;i<json.length;i++){ ret.push(json[i]); } var dgData = http://www.mamicode.com/{};//设置datagrid中显示的记录,以及分页显示用到的总记录条数>package com.dbstar.uaas.utils; import java.util.List; public class Pagination {//这就是我们的分页对象 /** * 总记录数 */ private long counts; /** * 第几页 */ private Integer pageNo=1; /** * 每页显示记录的条数,默认值为10 */ private Integer pageSize=10; /** * 总页数 */ private int pageCount; /** * 是否成功 */ private boolean suc; /** * 当前页显示的记录 */ private List reusltList; public Integer getPageNo() { return pageNo; } public void setPageNo(Integer pageNo) { this.pageNo = pageNo; } public Integer getPageSize() { return pageSize; } public void setPageSize(Integer pageSize) { this.pageSize = pageSize; } public int getPageCount() { return pageCount; } public void setPageCount(int pageCount) { this.pageCount = pageCount; } public List<Object> getReusltList() { return reusltList; } public void setReusltList(List reusltList) { this.reusltList = reusltList; } public long getCounts() { return counts; } public boolean isSuc() { return suc; } public void setSuc(boolean suc) { this.suc = suc; } public void setCounts(long counts) { if(counts % pageSize == 0) { pageCount = (int)counts / pageSize; }else { pageCount = (int)(counts + pageSize) / pageSize; } if(pageNo<1){ pageNo = 1; }else if(pageNo > pageCount) { pageNo = pageCount; } this.counts = counts; } }好了,我们来看一下后台的查询方法/** * 查询厂商信息 * @return */ public String searchFirmInfos(){ try { if(firmManager==null) firmManager = new FirmManager(); if(firmQueryBean==null){ firmQueryBean = new FirmQueryBean(); } if(pagination==null){ pagination = new Pagination(); } pagination = firmManager.searchFirmInfosByPage(firmQueryBean, pagination); pagination.setSuc(true); } catch (Exception e) { pagination.setSuc(false); logger.error("ther operate DB error.."); e.printStackTrace(); } result=JSONObject.fromObject(pagination); return SUCCESS; }最后我们再来看一下显示效果的页面好了,这样我们就大功告成,如果有什么疑问的朋友,我们可以再一起讨论。因为毕竟也对easyUI接触的时间不长。
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。