jqGrid使用

基本配置

"GRID_OPTION" : function(){
		return {
			"shrinkToFit" : true,
			"gridstate" : "hidden",
			"height" : "auto",
		    "rowNum": 10,
		    "rowList": [10, 20, 30],
			"viewrecords": true,
		    "gridview": true,
		    "pager" : "#grid-pager",
		    "autowidth" : true,
		    "toolbar" : [true,'bottom'],
		    "jqModal" : false,
		    "datatype" : "json",
		    "mtype" : "POST",
			"jsonReader" : { 
	            root:"data.pageData",
	            page: "data.pagecurrentPage",
	            total: "data.totalPage",
	            records: "data.totalRows",
	            repeatitems : false
	        },
		    "loadComplete":function(){	            
		    	$('.navtable .ui-pg-button').tooltip({container:'body'});
				$(this).find('.ui-pg-div').tooltip({container:'body'});
		    }
		};
	}
};

　　

$grid =$grid.jqGrid($.extend(Const.GRID_OPTION(),{
			'url' : PATH+'/treatment/phr/basicInfo/page',
			'colNames':['id','操作'],
			'colModel':[
			    {'name':'id', 'hidden':true},  {'name':'option','fixed':true,'sortable':false,'resize':false,'formatter':rowformatter,'width':100}
            ],
            'caption' : '列表'
		})).jqGrid('navGrid',Const.GRID_PAGER_ID,{
			edit: false,
			add: true,
			addicon : 'ace-icon fa fa-plus-circle purple',
			
			addfunc : function(e){
				$formDialog.dialog($.extend(dialogOption,{title:"新增"}));
				$formDialog.dialog("open");
				reloadHisGrid();
			},
			
			del: false,
			search: false,
			refresh: true,
			refreshicon : 'ace-icon fa fa-refresh green'
		});

　　其中操作配置为：

var rowformatter = function(cellvalue, options, rowObject){
			rowObject.rowId = options.rowId;
			return Const.OPT_TPL(rowObject);
		};

　　

"OPT_TPL" : _.template($.trim($("#operation-formmatter-tpl").html()),{ 'variable': 'row' }),

　　

操作显示：

<script id="operation-formmatter-tpl" type="lodash-tpl">
	<div style="margin-left:8px;"><div title="查看所选记录" data-rowid={{=row.rowId}}  data-objId="{{=row.id}}" onclick="jQuery.fn.detailById.call(this)" style="float:left;cursor:pointer;" class="ui-pg-div ui-inline-detail"><span class="ui-icon ui-icon-search"></span></div></div>
</script>	

　　

获取选中行数据：

var obj = $grid.getRowData($(this).attr("data-rowid"));

　　

重新加载表单数据：

$grid.jqGrid('setGridParam',{
					page : 1,
					postData : {}
				}).trigger('reloadGrid');