jqgrid中分页和搜索,jqgrid loadonce:true后trigger("reloadGrid")无效

  第一次接触jqgrid,发现项目中好多地方都用到。
  jqgrid是典型的B/S架构(浏览器/服务器模式),服务器端只需提供数据管理,浏览器只需负责数据显示。
  jqGrid是用ajax实现对请求和响应的处理,支持局部实时刷新。
  在对数据进行table显示还是很方便的,只是里面的参数配置很多需要去了解一下。

1.需求

  1. 项目中一个table的分页有问题(jqGridPager)不能点击下一页进行跳转。
  2. 对该table下面的单子信息中的series等多个信息字段进行匹配查询操作
    在这里插入图片描述

2.修改bug增加新业务

  1. 首先修改原来的table数据不能分页跳转问题,后台的接口都写好了(Oracle的分页by rownum)。主要是页面个page不能正确传递到后台。
      增加loadonce:true属性.发现问题解决。(但为后面搜索功能留下坑)
    在这里插入图片描述
  2. 增加新的搜索功能,针对这个搜索的业务还是有点绕的,可能是数据库设计不是很友好。
    不是根据table中已有的字段属性进行匹配查询,需要进入单子里面的信息(一对多,而且数据在多张数据表中)
select tab.* from 
   (
       select rownum rn, o.id npi2mpId,o.change_number npi2mpNumber, p2.text01 subject, 
               getuser(o.originator, 4) originator, o.create_date createDate 
       from  obj_change o, obj_page_two p2,
         (
           select  c.id mpid from  obj_change c,  OBJ_REV t 
           where t.text01 like '%W%' and t.text02 like '%W%' and t.text03 like '%WWWW2%'
           and t.change_id = c.id
           and t.numeric05 = 999
           and  c.category = 5
           and c.delete_flag = 0
           group by  c.id
          )r 
       where  o.id =r.mpid and p2.id =r.mpid      
      and rownum <=10
  )tab where rn >0

在这里又遇到一个问题,在使用distinct去重后rownum打乱了不能分页。想了一个办法通过group by去重再关联查询(当然这个问题还有其他很多解决方法)

将其装换为mybatis的xml配置

select tab.* from 
		   (
		       select rownum rn, o.id npi2mpId,o.change_number npi2mpNumber, 
		               p2.text01 subject, o.create_date createDate,
		               getuser(o.originator, 4) originator
		       from  obj_change o, obj_page_two p2,
			       (
			           select  c.id mpid  from  obj_change c,  OBJ_REV t 
			           where   t.numeric05 = #{npi2mpRevFlag} 			           
			           <if test="series != null and series != ''">
			           	 and upper(t.text01) like upper('%${series}%')
			           </if>
			           <if test="machineType != null and machineType != ''">
			           	 and upper(t.text02) like upper('%${machineType}%')
			           </if>
			           <if test="pcaPn != null and pcaPn != ''">
			           	 and upper(t.text03) like upper('%${pcaPn}%')
			           </if>			           	
			           and c.category = 5
			           and t.change_id = c.id    
			           and c.delete_flag = 0       
			           group by  c.id
			       )r 
		       where  o.id =r.mpid and p2.id =r.mpid       
		       and rownum &lt;=#{endNum}
		  )tab where rn &gt;#{startNum} 

这里使用${},也可使用#{},但要注意concat的oracle中只能连接两个值

  1. 后台的接口写好了,重新回到页面jqgrid,添加新的方法。
		_owner.reload = function(url, searchData) {
    		if (searchData == null) {
    			return;
    		}
    		_$jqGrid.jqGrid('setGridParam', {
    				postData : searchData, 
    				url: url,
    				page: 1, 
    				datatype:'json' //重新向服务器发送新的请求。
    			}).trigger("reloadGrid");
    		} 
    	} 

		function reloadNPI2MPTable(url) {
			   var searchData = {};
			   $("form :input[name]").each(function(){
				   var value = $(this).val();
				   searchData[this.name] = value;
			   });
			   //console.log("npi2mp查询条件",searchData);
			   npi2mpTable.reload(url, searchData);
			   return;
		 }

这个遇到问题是jqgrid loadonce:true后trigger(“reloadGrid”)无效

  1. setGridParam中加上参数datatype:‘json’,重新向服务器发送新的请求。
    例如:$("#grid").jqGrid().setGridParam({datatype:‘json’}).trigger(‘reloadGrid’);
  2. 或者在jqGrid version 4.8之后,在trigger中加上参数fromServer:true,
    例如:$("#list").trigger(“reloadGrid”, { fromServer: true, page: 1 });
  1. 改了jqgrid的参数属性后,测试功能。
posted @ 2019-09-12 10:22  gqzdev  阅读(1021)  评论(0编辑  收藏  举报