列表界面:

主要实现方式:前台组合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样例的更多相关文章

  1. jQuery easyUI的datagrid,如何在翻页以后仍能记录被选中的行

    1.先给出问题解决后的代码 <%@ page language="java" import="java.util.*" pageEncoding=&quo ...

  2. 【技巧】easyUI的datagrid,如何在翻页以后仍能记录被选中的行

    easyUI的datagrid在复选框多选时,如何在翻页以后仍能记录被选中的行: 注意datagrid中需要配置idField属性,一般为数据的主键

  3. 数据库.MongoDB.Java样例

    1.先在MongoDB官网下载Java驱动包 MongoDB Java Driver: http://mongodb.github.io/mongo-java-driver/ JAR包下载列表 htt ...

  4. JQuery easyUI DataGrid 创建复杂列表头(译)

    » Create column groups in DataGrid The easyui DataGrid has ability to group columns, as the followin ...

  5. jquery+正則表達式验证邮箱格式的样例

    js: $("#email").blur(function(){ //获取id相应的元素的值,去掉其左右的空格 var email = $.trim($('#email').val ...

  6. Web jquery表格组件 JQGrid 的使用 - 5.Pager翻页、搜索、格式化、自定义按钮

    系列索引 Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引 Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数.ColModel API.事件 ...

  7. jquery easyui combogrid Uncaught TypeError:Cannot read property

    ================================ ©Copyright 蕃薯耀 2020-01-07 https://www.cnblogs.com/fanshuyao/ 一.问题描述 ...

  8. Flask添加翻页功能(非sqlalchemy)

    最近做flask的项目,需要增加翻页的功能,网上找的教程都是结合sqlalchemy的,可是我用的不是sqlalchemy,肿木办呢? 以下是我的做法 一.前端 1.传递页码 前端我使用ajax提交表 ...

  9. 套用JQuery EasyUI列表显示数据、分页、查询

    声明,本博客从csdn搬到cnblogs博客园了,以前的csdn不再更新,朋友们可以到这儿来找我的文章,更多的文章会发表,谢谢关注! 有时候闲的无聊,看到extjs那么肥大,真想把自己的项目改了,最近 ...

随机推荐

  1. Java使用jackson问题解决

    Java使用jackson问题解决 >>>>>>>>>>>>>>>>>>>>&g ...

  2. Controller里写自己需要的Action,参数的名字必须和路由设置的参数名一致

    Controller里写自己需要的Action,参数的名字必须和路由设置的参数名一致,如果参数不一致,传过去为null

  3. 常用js代码学习

    1.用JS实现的radio图片选择按钮效果 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &q ...

  4. WisDom.Net 框架设计(七) 验证框架

    WisDom.Net-验证框架 1.分类 这里我们将数据验证分为以下几种 数据类型校验      主要用于确保数据类型输入的正确  比如年龄一项输入 A岁 ,显然不合法 域检查             ...

  5. 面向对象 ---Java抽象类

    在面向对象的概念中,所有的对象都是通过类来描绘的,但是反过来,并不是所有的类都是用来描绘对象的,如果一个类中没有包含足够的信息来描绘一个具体的对象,这样的类就是抽象类. 抽象类除了不能实例化对象之外, ...

  6. 查看xcode的路径

    sudo /usr/libexec/locate.updatedb locate liblaunch_sim

  7. 7-1 DBA顾问培训内容@20141230

    1, 逻辑读还是物理读? 查询语句的实际执行计划. F5 预计执行计划. --如何产生实际执行计划 ??. --Session收集指令.   workload repository report fo ...

  8. html-----001

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. cocos2dx入门分析 hello world

    打开新建的"findmistress"项目,可以看到项目文件是由多个代码文件及文件夹组成的,其中 Hello World 的代码文件直接存放于该项目文件夹中.下面我们来详细介绍一下 ...

  10. sublime text3-代码片段配置

    1.Tools->New Snippet-> <snippet>     <content><![CDATA[${1:public }function ${2 ...