jQuery EasyUI + struts2.3 + mongoDB 列表查询翻页JAVA样例
列表界面:

主要实现方式:前台组合json格式查询条件,提交至后台解析处理
一.前台搜索脚本
String.prototype.replaceAll = function (s1, s2) {
return this.replace(new RegExp(s1,"gm"),s2);
};
function doMongoSearch(){
var whereCond = new Object();
$("input[query],select[query]").each(function (index, domEle) {
var type = $(domEle).attr('type');
var query = $(domEle).attr('query').toUpperCase();
var name = $(domEle).attr('name');
var value = $(domEle).attr('value');
var checked = $(domEle).attr('checked');
var classVal = $(domEle).attr('class');
if (classVal != undefined){
if (classVal.indexOf("easyui-combobox") != -1){
value = $(domEle).combobox('getValue');
name = $(domEle).attr('id');
type = "text";
}else if (classVal.indexOf("easyui-datebox") != -1){
value = $(domEle).datebox('getValue');
name = $(domEle).attr('id');
type = "text";
}else if (classVal.indexOf("easyui-numberbox") != -1){
value = $(domEle).numberbox('getValue');
name = $(domEle).attr('id');
type = "text";
}
}
if((type =="text" || type=="select-one" || type=="hidden") && value != ""){
if (query == "BEGIN_DATE"){
whereCond["B$_"+name] = ">=@" + value.replaceAll("-","");
}else if (query == "END_DATE"){
whereCond["E$_"+name] = "<=@" + value.replaceAll("-","");
}else if (query == "BEGIN_TIME"){
whereCond["B$_"+name] = ">=@" + value.replaceAll("-","")+ "000000000";
}else if (query == "END_TIME"){
whereCond["E$_"+name] = "<=@" + value.replaceAll("-","")+ "235959999";
}else{
whereCond[name] = query + "@" + value;
}
} else if ((type=="checkbox" || type=="radio") && checked){
whereCond[name] = query + "@" + value;
}
});
var queryParams = $('#list_data').datagrid('options').queryParams;
queryParams.whereCond = JSON.stringify(whereCond);
$('#list_data').datagrid('getPager').pagination('select', 1);
}
/**
* 查询条件清除
* @return
*/
function cleanSearch(){
$("input[query],select[query]").each(function (index, domEle) {
var type = $(domEle).attr('type');
var classVal = $(domEle).attr('class');
if(type == undefined || type =="text" || type=="select-one"){
if (classVal != undefined){
if (classVal.indexOf("easyui-combobox") != -1){
$(domEle).combobox('clear');
}else if (classVal.indexOf("easyui-datebox") != -1){
$(domEle).datebox('clear');
}else if (classVal.indexOf("easyui-numberbox") != -1){
$(domEle).numberbox('clear');
}else{
$(domEle).val("");
}
}else{
$(domEle).val("");
}
}else if(type =="checkbox" || type=="radio"){
$(domEle).attr("checked",false);
}
});
}
二.前台html关键代码
<div class="easyui-layout" data-options="fit:true">
<div data-options="region:'center',border:false" style="padding:1px;">
<table >
<tr>
<td>手机号码:</td>
<td><input type="text" name="mobile" query="LIKE" style="width: 100px;" ></td>
</tr>
<tr>
<td>运营商:</td>
<td>
<input id="operator" name="operator" query="=INT" class="easyui-combobox" data-options="
valueField:'dictValue',
textField:'opName',
width:100,
url:'/manage/dict.do?action=loadValueName&bean.opId=yys&bean.dictLevel=2'"/>
</td>
</tr>
<tr>
<td>归属省:</td>
<td>
<input id="province" name="province" query="=" class="easyui-combobox" data-options="
valueField:'opId',
textField:'opName',
width:100,
url:'/manage/dict.do?action=loadIdName&bean.opId=cn&bean.dictLevel=2',
onSelect: function(node){
var url = '/manage/dict.do?action=loadIdName&bean.opId='+node.opId;
$('#city').combobox('clear');
$('#city').combobox('reload', url);
}"/>
</td>
</tr>
<tr>
<td>归属市:</td>
<td>
<input id="city" name="city" query="=" class="easyui-combobox"
data-options="valueField:'opId',textField:'opName',width:100" />
</td>
</tr>
<tr>
<td>号码来源:</td>
<td>
<input id="source" name="source" query="=INT" class="easyui-combobox" data-options="
valueField:'opId',
textField:'siteName',
width:100,
url:'/manage/mobilesite.do?action=loadSourceName'
"/>
</td>
</tr>
<tr>
<td >发布日期从</td>
<td><input type="text" name="publish" id="publish" class="easyui-datebox" query="BEGIN_DATE" style="width: 100px;" ></td>
</tr>
<tr>
<td align="right">至</td>
<td><input type="text" name="publish" id="publish" class="easyui-datebox" query="END_DATE" style="width: 100px;" ></td>
</tr>
</table>
</div>
<div data-options="region:'south',border:false" style="text-align: center; height: 30px; line-height:10px;">
<a class="easyui-linkbutton" data-options="iconCls:'icon-search'" href="javascript:void(doMongoSearch())">搜索</a>
<a class="easyui-linkbutton" data-options="iconCls:'icon-no'" href="javascript:void(cleanSearch())">清空</a>
</div>
</div>
三.后台action方法
public String doPage() {
pageData = new BN_Page("_id", "t_mobile_all", rows, page, sort, order, whereCond);
pageData = DAO_MobileQuery.getPage(pageData);
Map<String, Object> jsonMap = new HashMap<String, Object>();//定义map
jsonMap.put("total",pageData.getRowCount());
jsonMap.put("rows", pageData.getData());
jsonResult =JSONObject.fromObject(jsonMap);
return "doJSON";
}
后台DAO_MobileQuery方法
public static BN_Page getPage(BN_Page page) {
return new DAOMongo().doSelectPage(page, BN_Mobile.class);
}
后台BN_Page.java关键代码
private ArrayList data = new ArrayList();
private int rows = 15;
private int page = 1;
private String whereCond = "";
private int rowCount;
private String tableName = null;
private String sort = "";
private String order = "";
public BN_Page(String keyColumn, String tableName, String rows, String page,
String sort, String order, String whereCond)
{
this.keyColumn = keyColumn;
this.tableName = tableName;
this.rows = Integer.parseInt(rows);
this.page = Integer.parseInt(page);
this.sort = sort;
this.order = order;
this.whereCond = whereCond;
}
.....常规get/set 方法
后台DAOMongo.java关键方法
public BN_Page doSelectPage(BN_Page page, Class beanClass){
DBCollection connection = db.getCollection(page.getTableName());
DBObject queryObject = new BasicDBObject();
if (!ObjectUtil.isNull(page.getWhereCond())){
logger.info("whereCond="+page.getWhereCond());
List<Map<String, Object>> whereCondList = JsonUtil.json2List("["+page.getWhereCond()+"]");
Map<String, Object> map = whereCondList.get(0);
Set<String> set = map.keySet();
for (Iterator<String> it = set.iterator();it.hasNext();) {
String queryColumn = it.next();
String queryValue = map.get(queryColumn).toString();
if (queryColumn.startsWith("B$_") || queryColumn.startsWith("E$_")){
queryColumn = queryColumn.substring(3);
}
if (queryValue.startsWith("LIKE@")){
queryObject.put(queryColumn,
Pattern.compile("^.*"+queryValue.substring(5)+".*$", Pattern.CASE_INSENSITIVE));
}else if (queryValue.startsWith("=@")){
queryObject.put(queryColumn, queryValue.substring(2));
}else if (queryValue.startsWith("=INT@")){
queryObject.put(queryColumn, new Integer(queryValue.substring(5)).intValue());
}else if (queryValue.startsWith(">@")){
if (queryObject.containsField(queryColumn)){
((BasicDBObject)queryObject.get(queryColumn)).append("$gt",queryValue.substring(2));
}else{
queryObject.put(queryColumn, new BasicDBObject("$gt",queryValue.substring(2)));
}
}else if (queryValue.startsWith(">INT@")){
if (queryObject.containsField(queryColumn)){
((BasicDBObject)queryObject.get(queryColumn)).append("$gt",new Integer(queryValue.substring(5)).intValue());
}else{
queryObject.put(queryColumn, new BasicDBObject("$gt",new Integer(queryValue.substring(5)).intValue()));
}
}else if (queryValue.startsWith(">=@")){
if (queryObject.containsField(queryColumn)){
((BasicDBObject)queryObject.get(queryColumn)).append("$gte",queryValue.substring(3));
}else{
queryObject.put(queryColumn, new BasicDBObject("$gte",queryValue.substring(3)));
}
}else if (queryValue.startsWith(">=INT@")){
if (queryObject.containsField(queryColumn)){
((BasicDBObject)queryObject.get(queryColumn)).append("$gte",new Integer(queryValue.substring(6)).intValue());
}else{
queryObject.put(queryColumn, new BasicDBObject("$gte",new Integer(queryValue.substring(6)).intValue()));
}
}else if (queryValue.startsWith("<@")){
if (queryObject.containsField(queryColumn)){
((BasicDBObject)queryObject.get(queryColumn)).append("$lt",queryValue.substring(2));
}else{
queryObject.put(queryColumn, new BasicDBObject("$lt",queryValue.substring(2)));
}
}else if (queryValue.startsWith("<INT@")){
if (queryObject.containsField(queryColumn)){
((BasicDBObject)queryObject.get(queryColumn)).append("$lt",new Integer(queryValue.substring(5)).intValue());
}else{
queryObject.put(queryColumn, new BasicDBObject("$lt",new Integer(queryValue.substring(5)).intValue()));
}
}else if (queryValue.startsWith("<=@")){
if (queryObject.containsField(queryColumn)){
((BasicDBObject)queryObject.get(queryColumn)).append("$lte",queryValue.substring(3));
}else{
queryObject.put(queryColumn, new BasicDBObject("$lte",queryValue.substring(3)));
}
}else if (queryValue.startsWith("<=INT@")){
if (queryObject.containsField(queryColumn)){
((BasicDBObject)queryObject.get(queryColumn)).append("$lte",new Integer(queryValue.substring(6)).intValue());
}else{
queryObject.put(queryColumn, new BasicDBObject("$lte",new Integer(queryValue.substring(6)).intValue()));
}
}else if (queryValue.startsWith("!=@")){
queryObject.put(queryColumn, new BasicDBObject("$ne",queryValue.substring(3)));
}else if (queryValue.startsWith("!=INT@")){
queryObject.put(queryColumn, new BasicDBObject("$ne",new Integer(queryValue.substring(6)).intValue()));
}
}
}
DBObject sortObject = new BasicDBObject();
sortObject.put(page.getSort(), page.getOrder().equals("asc")? 1 : -1);
logger.info("collection="+page.getTableName());
logger.info("queryObject="+queryObject.toString());
logger.info("sortObject="+sortObject.toString());
logger.info("limit="+page.getRows());
logger.info("skip="+page.getRowNo());
DBCursor cursor = connection.find(queryObject);
page.setRowCount(cursor.count());
cursor = cursor.sort(sortObject).limit(page.getRows()).skip(page.getRowNo());
try {
while (cursor.hasNext()){
DBObject object = cursor.next();
BN_Row row = (BN_Row) beanClass.newInstance();
row.columnMap.putAll(object.toMap());
page.addRow(row);
}
} catch (InstantiationException e)
{ // TODO Auto-generated catch block e.printStackTrace(); } catch (IllegalAccessException e) { // TODO Auto-generated catch block e.printStackTrace(); } finally { cursor.close(); }
db = null;
connection = null;
return page;
}
jQuery EasyUI + struts2.3 + mongoDB 列表查询翻页JAVA样例的更多相关文章
- jQuery easyUI的datagrid,如何在翻页以后仍能记录被选中的行
1.先给出问题解决后的代码 <%@ page language="java" import="java.util.*" pageEncoding=&quo ...
- 【技巧】easyUI的datagrid,如何在翻页以后仍能记录被选中的行
easyUI的datagrid在复选框多选时,如何在翻页以后仍能记录被选中的行: 注意datagrid中需要配置idField属性,一般为数据的主键
- 数据库.MongoDB.Java样例
1.先在MongoDB官网下载Java驱动包 MongoDB Java Driver: http://mongodb.github.io/mongo-java-driver/ JAR包下载列表 htt ...
- JQuery easyUI DataGrid 创建复杂列表头(译)
» Create column groups in DataGrid The easyui DataGrid has ability to group columns, as the followin ...
- jquery+正則表達式验证邮箱格式的样例
js: $("#email").blur(function(){ //获取id相应的元素的值,去掉其左右的空格 var email = $.trim($('#email').val ...
- Web jquery表格组件 JQGrid 的使用 - 5.Pager翻页、搜索、格式化、自定义按钮
系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...
- jquery easyui combogrid Uncaught TypeError:Cannot read property
================================ ©Copyright 蕃薯耀 2020-01-07 https://www.cnblogs.com/fanshuyao/ 一.问题描述 ...
- Flask添加翻页功能(非sqlalchemy)
最近做flask的项目,需要增加翻页的功能,网上找的教程都是结合sqlalchemy的,可是我用的不是sqlalchemy,肿木办呢? 以下是我的做法 一.前端 1.传递页码 前端我使用ajax提交表 ...
- 套用JQuery EasyUI列表显示数据、分页、查询
声明,本博客从csdn搬到cnblogs博客园了,以前的csdn不再更新,朋友们可以到这儿来找我的文章,更多的文章会发表,谢谢关注! 有时候闲的无聊,看到extjs那么肥大,真想把自己的项目改了,最近 ...
随机推荐
- 标准web架构分层
标准Web系统的架构分层 转载:http://blog.csdn.net/yinwenjie http://blog.csdn.net/yinwenjie/article/details/464 ...
- Java 对象属性的遍历
package com.cn.mybatis.test; import java.io.IOException; import java.io.InputStream; import java.lan ...
- strace跟踪操作的详细内容
- Javascript实现图片库效果
思路: 无序列表加载图片文件.用img标签加载一张图片作为占位符.当点击照片链接时,改变<a>元素的href属性.并且阻止浏览器的默认行为. 动态改变描述文字,在图片下方增加P标签.通过获 ...
- 开发错误日志之No matching bean of type [xxx] found for dependency
No matching bean of type [org.springframework.data.mongodb.core.MongoTemplate] found for dependency ...
- C#程序中:如何向xml文件中写入数据和读取数据
xml文件作为外部信息存储文件使用简单,方便,其结构和表格略有相似,下面简单的说一下xml文件内容的读取 …… using System.Xml;using System.IO;namespace W ...
- 图标字体的使用(fontello.com)字体推荐及使用技巧
网页设计中为了页面漂亮好看,图标是少不了,网页中使用的图标通常都是使用图片,使用图片图标的有很多弊端,如果你经常制作网页应该有一肚子埋怨. 使用图片图标的弊端 放大图标必须重新作图, 改变颜色必须开启 ...
- MAC 使用Jetbrains's产品
Jetbrains's MAC 使用 ./gradle fatjar 或者 ./gradlew.sh fatjar java -jar build/lib/xx.jar 链接: http://pan. ...
- 关于Android中传递数据的一些讨论--备用
在Android中编写过程序的开发人员都知道.在Activity.Service等组件之间传递数据(尤其是复杂类型的数据)很不方便.一般可以使用Intent来传递可序列化或简单类型的数据.看下面的代码 ...
- Quartz1.8.5例子(七)
/* * Copyright 2005 - 2009 Terracotta, Inc. * * Licensed under the Apache License, Version 2.0 (the ...