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的參數屬性後,測試功能。
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章