Jmesa 表格分页的配置 及其使用方法
施德运
1.首先去jmesa网站下载一个zip包，当前是最新4.0版本，不过我为了稳定，还是下载了3.0.4版本。下载地址：http://code.google.com/p/jmesa/downloads/detail?name=jmesa-3.0.4.zip
2.下载完成之后，解压缩，找到dist文件下jmesa-3.0.4.jar导入到自己的项目中。同时将该目录下的jmesa.css、jmesa.min.js、jquery.jmesa.min.js复制到自己的项目相应的位置下。
找一个jquery的js,例如jquery-1.5.1.min.js文件也复制到相应的位置下。
将这三个js文件依次引入你的jsp页面，注意是依次：
<script type="text/javascript" src="${ctx}/resources/js/jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="${ctx}/resources/js/jmesa.min.js"></script>
<script type="text/javascript" src="${ctx}/resources/js/jquery.jmesa.js"></script>若把jquery脚本放到后面，页面会提示错误找不到JQuery之类的错误。
3.咦，第三步好像没有什么。。嘿嘿。丢了~
4.将解压缩文件下的images下png文件夹复制到你的项目的相应位置。
5.配置相应的jmesa.properties文件。自己在WEB-INF目录下新建一个jmesa.properties文件，然后可以自由设定一些值，在该配置文件中可以控制页面如何显示信息。
例:limit.rowSelect.maxRows=10每页将显示10行数据
html.toolbar.maxRowsDroplist.increments=10,20,60每页的数据行数可以在10,20,60之间进行切换
html.imagesPath=/resources/images/png/表示jmesa默认的图片存放的位置，这个就是你之前复制的png文件夹所存放的位置啦
注意：这里是配置文件中一些相应的设置：可以自己添加
html.statusbar.resultsFound=Results {1} - {2} of {0}.
html.statusbar.noResultsFound=There were no results found.
html.toolbar.tooltip.firstPage=First Page
html.toolbar.tooltip.lastPage=Last Page
html.toolbar.tooltip.prevPage=Previous Page
html.toolbar.tooltip.nextPage=Next Page
html.toolbar.tooltip.filter=Filter
html.toolbar.tooltip.clear=Clear
html.toolbar.tooltip.saveWorksheet=Save Worksheet
html.toolbar.tooltip.filterWorksheet=Filter Worksheet
html.toolbar.tooltip.excel=XLS Export
html.toolbar.tooltip.jexcel=XLS Export
html.toolbar.tooltip.pdf=PDF Export
html.toolbar.tooltip.pdfp=PDF Export
html.toolbar.tooltip.csv=CSV Export
html.toolbar.tooltip.xml=XML Export
html.toolbar.text.firstPage=First
html.toolbar.text.lastPage=Last
html.toolbar.text.nextPage=Next
html.toolbar.text.prevPage=Prev
html.toolbar.text.filter=Filter
html.toolbar.text.clear=Clear
html.toolbar.text.saveWorksheet=Save Worksheet
html.toolbar.text.filterWorksheet=Filter Worksheet
html.toolbar.text.excel=XLS
html.toolbar.text.jexcel=XLS
html.toolbar.text.pdf=PDF
html.toolbar.text.pdfp=PDF
html.toolbar.text.csv=CSV
html.toolbar.text.xml=XML6.配置相应的web.xml,在里面添加：
<context-param>//APP将2中的配置信息读取
<param-name>jmesaPreferencesLocation</param-name>
<param-value>WEB-INF/jmesa.properties</param-value>
</context-param>
<context-param>//后台table实现国家化的配置文件
<param-name>jmesaMessagesLocation</param-name>
<param-value>messages/message_info</param-value>
</context-param>messages表示国际化文件存放的文件夹，message_info表示国际化文件的名字开头。
比如 message_info_zh_CN.properties message_info_zh_HK.properties等等。
7.如果要在spring里面添加国际化支持的话，就要配置spring.xml文件，在里面添加：
<!--i18n设置默认语言是繁体-->
<beanid="localeResolver"class="org.springframework.web.servlet.i18n.SessionLocaleResolver">
<propertyname="defaultLocale"value="zh_HK"></property>
</bean>
<beanid="localeChangeInterceptor"class="org.springframework.web.servlet.i18n.LocaleChangeInterceptor"/>8.jmesa实现分页可以采用两种方法:a.标签实现b.java代码进行页面构造
以下将采用方式b。
a.某controller的跳转方法
publicModelAndView gostaff(HttpServletRequest request,
HttpServletResponse response)throws Exception {
ModelAndView view = newModelAndView();
//构造id为staffInfo的table
TableModeltableModel = newTableModel("staffInfo",request,response);
//为tableModel添加数据
tableModel.setItems(newPageItems() {
@Override
publicint getTotalRows(Limit limit) {
//TODO Auto-generated method stub
returnstaffManager.getStaffTotalRowService();
}
@Override
publicCollection<?> getItems(Limit limit) {
//TODO Auto-generated method stub
intendRow = limit.getRowSelect().getRowEnd();//获取当前最后一条数据的行数
intstartRow =limit.getRowSelect().getRowStart();//获取当前第一天数据的行数
returnstaffManager.queryAllStaff(startRow,endRow);
}
});
//利用getHtmlTable()来构造table的具体的样式
tableModel.setTable(getHtmlTable());
//将tableModel对象转换成一个字符串到前台会进行解析
request.setAttribute("staffInfo",tableModel.render());
view.setViewName("staff/staffIndex1");
return view;
}
//构造相应的table样式
private TablegetHtmlTable() {
//创建HtmlTable 对象 实质上就是HTML的<table></table>
HtmlTable htmlTable = new HtmlTable().width("910");
//table的标题实现国际化需要在web.xml文件中进行配置
htmlTable.setCaptionKey("title");
//创建HtmlRow 实质上HTML的<tr></tr>
HtmlRow row = new HtmlRow();
htmlTable.setRow(row);//table设置相应的行
//指定相应的列信息 "username"对应相应的对象的属性"StaffName"是table显示时的列名，当列名需要实现国际化时，调用.titleKey("配置文件中的key值")
HtmlColumn staffName = new HtmlColumn("username").title("StaffName");
row.addColumn(staffName);
HtmlColumn pwd = newHtmlColumn("password").title("Psassword");
row.addColumn(pwd);
HtmlColumn email = new HtmlColumn("email").title("Email");
row.addColumn(email);
HtmlColumn phoneNumber = new HtmlColumn("mobilePhone");
row.addColumn(phoneNumber);
HtmlColumn telphone = new HtmlColumn("telphone");
row.addColumn(telphone);
//表格的某一列需要显示对象的对象属性的值直接"."
HtmlColumn registerNum = newHtmlColumn("companyCop.registerNum").title("RegisterNum");
row.addColumn(registerNum);
//当需要显示的值是Hashset中的对象属性时,需要创建CellEditor()进行遍历取出,需要的属性值
HtmlColumncompanyName = new HtmlColumn("companyCpn").title("CompanyName");
companyName.setCellEditor(new CellEditor() {
@Override
publicObject getValue(Object item, String property, int rowcount){
// TODOAuto-generated method stub
Set<CompanyNameCpn> setCName =((StaffStf)item).getCompanyCop().getCompanyNameCpns();
String cName = "";
if(setCName.size()!=0){
for(int i=0;i<setCName.size();i++){
cName = setCName.iterator().next().getName();
}
}
return cName;
}
});
row.addColumn(companyName);
//table中的某一列需要以链接的形式显示
HtmlColumn detail = new HtmlColumn().title("Detail");
detail.setCellEditor(new CellEditor() {
@Override
publicObject getValue(Object item, String property, int rowcount){
// TODOAuto-generated method stub
//动态的将查找出的数据已连接的形式显示
//Object value = new HtmlCellEditor().getValue(item, property,rowcount);
HtmlBuilder html = new HtmlBuilder();
html.a().href().quote().append("点击链接所发送的请求").quote().close();
html.append("Detail");//链接显示的内容
html.aEnd();
return html.toString();
}
});
row.addColumn(detail);
HtmlColumn update = new HtmlColumn().title("Update");
update.setCellEditor(new CellEditor() {
@Override
public ObjectgetValue(Object item, String property, int rowcount) {
// TODO Auto-generated method stub
//Object value = new HtmlCellEditor().getValue(item, property,rowcount);
HtmlBuilder html = new HtmlBuilder();
html.a().href().quote().append("").quote().close();
html.append("Update");
html.aEnd();
return html.toString();
}
});
row.addColumn(update);
HtmlColumn delete = new HtmlColumn().title("Delete");
delete.setCellEditor(new CellEditor() {
@Override
public ObjectgetValue(Object item, String property, int rowcount) {
// TODO Auto-generated method stub
//Object value = new HtmlCellEditor().getValue(item, property,rowcount);
HtmlBuilder html = new HtmlBuilder();
html.a().href().quote().append("").quote().close();
html.append("Delete");
html.aEnd();
return html.toString();
}
});
row.addColumn(delete);
return htmlTable;
}9.对应的jsp页面的写法：除了要在页面头部引入相应的js文件之外，还要添加两个js方法。
<script type="text/javascript">
functiononInvokeAction(id) {
$.jmesa.createHiddenInputFieldsForLimitAndSubmit(id);//打印excel等时候调用
}
functiononInvokeExportAction(id) { //点击上一页下一页调用
varparameterString = $.jmesa.createParameterStringForLimit(id);
location.href= '${ctx}/xxx/list.do?&'+ parameterString; //这个就是你请求调用table的url请求路径
}
</script>那么，如何将后台生成的htmltable显示到jsp页面呢？就是下面了，很简单：
<form name="staffForm" style="width:600px;">
<div id="staffInfo">
${staffInfo}
<!--与后台代码相对应request.setAttribute("staffInfo",tableModel.render());-->
</div>
</form>好了，就这样配完了。。没有了吗，亲~
类似资料：