`
飞天小女警
  • 浏览: 107161 次
  • 性别: Icon_minigender_2
  • 来自: 重庆
社区版块
存档分类
最新评论

jgGrid参数说明文档

阅读更多

初始化JqGrid的方法:

function initJQGrid(){
       $("#jqgridTable").jqGrid({
	multiselectWidth : 30,
	scrollOffset : 20,
	altRows : false,
	deepempty : true,
	sortable : true,
	hidegrid : false,
	height : '308',
	multiselect : true,
	multiboxonly : true,
	viewsortcols : [true,'horizontal',false],
	datatype : 'json',
	jsonReader : {
		repeatitems : false
	},
	mtype : 'post',
	url : "${ctx}/babyis/wcbj/txgl/searchTree.action?yunzStart=1&yunzEnd=40",
	colModel : [
	{
	name : 'mmxm',
	label : '姓名',
	width : 90,
	sortable : false
	},
	{
	name : 'zhm',
	label : '主号',
	width : 110,
	sortable : false
	},
	{
	name : 'chmstr',
	label : '从号',
	width : 145,
	sortable : false
	}
	],
	pager : '#jqgridDiv',  //分页栏div的id
	rowNum : 10,          //初始行数
	rowList : [10,15],   //每页的行数
	viewrecords : true,
	subGrid : true,      //子表
	subGridRowExpanded: function(subgrid_id, row_id) {  //下拉,显示详细信息
	       $("#"+subgrid_id).css("height","190");   //设置下拉详细信息的高度
	          $("#"+subgrid_id).html("<iframe src='${ctx}/babyis/wcbj/txgl/showYhDetail.action?userId="+row_id+"' width='100%' height='190' frameborder='0'></iframe>"); //加载html
	},
	onSelectRow: function(id){
	      var ids = jQuery("#jqgridTable").jqGrid('getGridParam', 'selarrrow');  //获得所有选中的行
	      for (var i = 0; i < ids.length; i++) {
		 var rowData = JQuery("#jqgridTable").jqGrid('getRowData',ids[i]);  //获得每行的数据
		 var sjh = rowData.zhm;   //行对象.列名 可获得该行该列的值
		 if(rowData.chmstr != "") {
		       sjh = sjh+","+rowData.chmstr;
		  }
		 var value = rowData.mmxm+"("+sjh+")";
		window.sxrJson[ids[i]] = value;
		}
		var sxr = document.getElementById("sxr");
		setValueToSxr(sxrJson, sxr);
		$("#wcbj_txgl_sendAllTxdx").hide();
	},    
	onSelectAll: function(aRowids,status){  //checkbox复选框,全选事件 aRowids 所有选中的行id status 头上全选 true为选中
	     if(status){
		for (var i = 0; i < aRowids.length; i++) {
		    var rowData = jQuery("#jqgridTable").jqGrid('getRowData',aRowids[i]);
		    var sjh = rowData.zhm;
		 		    if(rowData.chmstr != "") {
		 		       sjh = sjh+","+rowData.chmstr;
		 		    }
		 		    var value = rowData.mmxm+"("+sjh+")";
				    window.sxrJson[aRowids[i]] = value;
				}
				var sxr = document.getElementById("sxr");
				setValueToSxr(sxrJson, sxr);
				$("#wcbj_txgl_sendAllTxdx").hide();
			  }
			}
		});
	}

html页面:

<!--很简单的div-->
<table id="jqgridTable"></table>
<div id="jqgridDiv"></div> 

  

 

从前台改变jgrid加载时的url,传入相应的参数,后台传入JSon数据重新加载JqGrid

function searchTxYh(urlEn) {
        jQuery("#jqgridTable").jqGrid("setGridParam", {
                url: urlEn,    //设置表格的url
                datatype: "json"   //设置数据类型                                                  
      }).trigger("reloadGrid");
 }

后台数据的组装:

public void searchTree() throws Exception {
		String mmxm = getParameter("mmxm");
		String mmdh = getParameter("mmdh");
		String mcyjStart = getParameter("mcyjStart");
		String mcyjEnd = getParameter("mcyjEnd");
		String yunzStart = getParameter("yunzStart");
		String yunzEnd = getParameter("yunzEnd");
		
		StringBuffer sb = new StringBuffer();
		if(StringUtils.isNotEmpty(mcyjStart)) {
			sb.append(" and wbda.mcyj >= "+mcyjStart.replaceAll("-", ""));
		}
		if(StringUtils.isNotEmpty(mcyjEnd)) {
			sb.append(" and wbda.mcyj <= "+mcyjEnd.replaceAll("-", ""));
		}
		if (StringUtils.isNotEmpty(yunzStart) && StringUtils.isNotEmpty(yunzEnd)) {
			sb.append(" and wbda.mcyj is not null ");
			Long d = CalendarUtil.getLongDate();// 得到当前时间
			String date = CalendarUtil.formatByChar(d, '/', '/');
			// 根据孕周计算mcyj范围,进行时间比较
			int bfDay = (Integer.parseInt(yunzStart)-1) * 7;
			int afDay = Integer.parseInt(yunzEnd)*7;
			String bfMcyj = CalendarUtil.getDateBefore(date, bfDay);
			String afMcyj = CalendarUtil.getDateBefore(date, afDay);
			sb.append(" and wbda.mcyj <= " + CalendarUtil.getLong(bfMcyj) + " and wbda.mcyj >= " + CalendarUtil.getLong(afMcyj));
		}
		if (StringUtils.isNotEmpty(mmxm)) {
			sb.append(" and yhjb.mmxm like '%" + mmxm + "%' ");
		}
		int pageNum =  1;
		if(StringUtils.isNotEmpty(this.getParameter("page")))
			pageNum = Integer.parseInt(this.getParameter("page"));
		int pageSize = 10;
		if(StringUtils.isNotEmpty(this.getParameter("rows")))
			pageSize = Integer.parseInt(this.getParameter("rows"));
		
		Pagination<?> results = this.txglManager.findFztxYhBySql(sb.toString(), mmdh, Integer.valueOf(pageNum), Integer.valueOf(pageSize));
		JSONArray js = new JSONArray();
		for (Iterator<?> iter = results.getResults().iterator(); iter.hasNext();) {
			Object[] result = (Object[]) iter.next();
			JSONObject objTmp = new JSONObject();
			String[] yhglsjhs = (result[2] != null) ? String.valueOf(result[2]).split("#") : null;
			
			String zhm = (yhglsjhs != null) ? yhglsjhs[0] : "";
			String chmstr = (yhglsjhs != null && yhglsjhs.length > 1) ? yhglsjhs[1].substring(1) : "";
			
			String sjh = (chmstr.equals("")) ? zhm : zhm+","+chmstr;
			sjh = sjh.replaceAll(",", "_");
			objTmp.put("id", result[1]+"_"+sjh);  //yhjbid+","+sjh
			objTmp.put("mmxm", (result[0] != null) ? String.valueOf(result[0]) : "");
			objTmp.put("zhm", zhm);
			objTmp.put("chmstr", chmstr);
			js.add(objTmp);
		}
		JSONObject obj = new JSONObject();
		obj.put("rows", js);
		obj.put("total", (results.getTotalCount() + pageSize - 1) / pageSize);
		obj.put("page", pageNum);
		obj.put("records", results.getTotalCount());
		
		obj.put("searchstr", sb.toString());
		getResponse().setContentType("text/plain");
		getResponse().setCharacterEncoding("UTF-8");
		getResponse().getWriter().write(obj.toString());
		getResponse().getWriter().flush();
	}

由于时间问题,就不整理后台代码了,相信亲们能看懂的。 

  

 

参数说明:

有个很全面的网址:http://blog.csdn.net/homez/archive/2010/07/29/5773675.aspx

给个链接,在这里就不复制粘贴了。

分享到:
评论

相关推荐

    jgGrid 3.3.1带文档和demo

    - **初始化jgGrid**:通过JavaScript代码配置jgGrid,指定数据源、列设置、分页参数等。 - **绑定数据**:根据数据源类型,使用相应的API将数据绑定到jgGrid。 - **定制行为**:通过事件监听和回调函数,定制...

    jggrid资料

    1. **jqGrid3.6最全面最详尽中文文档.doc**:这份文档详细阐述了jgGrid3.6的所有功能和配置选项,是学习和开发jgGrid的重要参考资料。 2. **jqGrid详解及高级应用(1).pdf**:这是一份深入讲解jgGrid高级特性和实践...

    jggrid的java实现

    4. **分页和过滤**:为了支持分页和过滤,Servlet需要根据JGGrid的请求参数动态生成SQL查询语句,以返回特定范围和过滤条件下的数据。 5. **错误处理**:无论何时,都需要处理可能出现的错误,比如数据库连接问题、...

    于JQuery对开源插件jgGrid的功能应用

    在ASP.NET环境中,可以利用DataSet直接输出XML格式的数据,因此下面将以XML格式的数据为例进行说明。 首先,在服务器端创建一个后台数据源。这里选用Access作为后台数据库。在客户端,jqGrid的调用格式为`jQuery('#...

    jqgrid标签说明

    在学习jqgrid的时候,是否遇到很多不懂的地方,在这里给出jqgrid的标签说明,希望对大家有所帮助

    jqgrid 4.4最新版

    8. **API接口**:jqGrid提供了丰富的API接口,允许开发者通过JavaScript代码来控制网格的行为,如reloadGrid()用于重新加载数据,setGridParam()用于动态更改网格参数。 9. **增强的搜索功能**:4.4版本可能包含了...

    JQGrid本地数据分页

    用户可以通过点击表格上方的排序图标进行列排序,通过底部的分页栏切换页码,JQGrid会根据设定的参数自动处理这些操作。 为了增强用户体验,我们还可以添加一些自定义的事件处理函数,例如,当用户改变分页大小时...

    jquery.jqGrid.js顶部工具栏扩展

    jqGrid顶部工具栏扩展,可将导航按钮及自定义按钮添加到表格的顶部,使用方法见https://blog.csdn.net/liandi_123456/article/details/89501692

    基于PHP和Mysql相结合使用jqGrid读取数据并显示

    通过调用`$("#list").jqGrid()`方法,我们可以配置jqGrid的各项参数。这里,我们将`url`设置为PHP脚本的路径,例如`do.php?action=list`,用于获取数据。`datatype`设定为`"json"`,意味着我们将从服务器接收JSON...

    jQuery表格列自由拖动排序.zip

    &lt;!doctype html&gt; &lt;... &lt;head&gt; ...meta charset="UTF-8"&gt;... 一款非常不错的表格列自由拖动排序js代码,单击鼠标长按表格列自由拖动排序,互换列排序代码,点击表格头部支持表格数据升降大小排序效果。

Global site tag (gtag.js) - Google Analytics