jqgrid初始化参数及colModel参数

jqGrid原理

jqGrid是典型的B/S架构，服务器端只是提供数据管理，客户端只提供数据显示。换句话说，jqGrid可以以一种更加简单的方式来展现你数据库的信息，而且也可以把客户端数据传回给服务器端。

对于jqGrid我们所关心的就是：必须有一段代码把一些页面信息保存到数据库中，而且也能够把响应信息返回给客户端。jqGrid是用ajax来实现对请求与响应的处理。

jqGrid|初始化|参数

/*******
			从后台获取贸易商物资信息数据
		******/
		var grid_data = [];	
		var start = 0;
		var limit = 100;
		var currentPage = 0;
		var dataStr = "start=" + start + "&limit=" + limit;
		$.ajax({
		    async:false,
			cache:false,
			url: "goods_findPageGoodsByTrader.do",
			data: dataStr,
            type: 'POST',
			success: function(result){
				var result = eval('('+ result +')');
				if(result.root != undefined && result.root.length > 0){
					var resultContent = result.root;
					var grid_child;
					for ( var i = 0; i < resultContent.length; i++) {
						grid_child = {id:resultContent[i].goodsId, 
								goodsOrder:resultContent[i].goodsOrder, goodsPackage:resultContent[i].goodsPackage, goodsName:resultContent[i].goodsName,
								goodsType:resultContent[i].goodsType, goodsMaterial:resultContent[i].goodsMaterial, goodsNumber:resultContent[i].goodsNumber, goodsWeight:resultContent[i].goodsWeight, 
								goodsWarranty:resultContent[i].goodsWarranty, goodsOrigin:resultContent[i].goodsOrigin, originName:resultContent[i].originName, 
								goodsContractreadtime:resultContent[i].goodsContractreadtime, dzPurchaseContractNum:resultContent[i].dzPurchaseContractNum, groupPurchaseContractNum:resultContent[i].groupPurchaseContractNum};
						grid_data[i] = grid_child;    
					}
				}
			},
			error:function(e){alert("获取贸易商物资信息失败");}
		});
	
			jQuery(function($) {
				var grid_selector = "#grid-table";
				var pager_selector = "#grid-pager";
				jQuery(grid_selector).jqGrid({
					//direction: "rtl",			//表格中文字的显示方向，从左向右（ltr）或者从右向左（rtr）
					
					data: grid_data,
					datatype: "local",			//从服务器端返回的数据类型
					height: 400,				//表格高度，可以是数字，像素值或者百分比
					/****列显示名称******/
					colNames:[' ', 'id', '订单号', '捆包号', '品名', '规格', '产品牌号(材质)', '数量', '重量(吨)', '质保书编号', '物资来源', '来源名称', '合同读取时间', '大宗物资网合同号', '集团合同库合同号', '查看附件', '详情'],
					/****常用到的属性：name 列显示的名称；index 传到服务器端用来排序用的列名称；width 列宽度；align 对齐方式；sortable 是否可以排序******/
					colModel:[
						{name:'myac',index:'', width:80, fixed:true, sortable:false, resize:false,
							formatter:'actions', 
							formatoptions:{ 
								keys:true,
								delOptions:{recreateForm: true, beforeShowForm:beforeDeleteCallback},
								//editformbutton:true, editOptions:{recreateForm: true, beforeShowForm:beforeEditCallback}
							}
						},
						{name:'id', index:'id', width:60, editable:false, hidden:true},
						{name:'goodsOrder',index:'goodsOrder', width:60, editable: true, editoptions:{size:"20",maxlength:"30"}},
						{name:'goodsPackage',index:'goodsPackage', width:60, editable: true, editoptions:{size:"20",maxlength:"30"}},
						{name:'goodsName',index:'goodsName',width:60, editable:true, editoptions:{size:"20",maxlength:"30"}},
						{name:'goodsType',index:'goodsType',width:60, editable:true, editrules:{edithidden: true}, hidden:true, editoptions:{size:"20",maxlength:"30"}},
						{name:'goodsMaterial',index:'goodsMaterial',width:60, editable:true, editrules:{edithidden: true}, hidden:true, editoptions:{size:"20",maxlength:"30"}},
						{name:'goodsNumber',index:'goodsNumber',width:60, editable:true, editrules:{edithidden: true}, hidden:true, editoptions:{size:"20",maxlength:"30"}},
						{name:'goodsWeight',index:'goodsWeight',width:60, editable:true, editrules:{edithidden: true}, hidden:true, editoptions:{size:"20",maxlength:"30"}},
						{name:'goodsWarranty',index:'goodsWarranty', width:60, editable: true, editoptions:{size:"20",maxlength:"30"}},
						{name:'goodsOrigin', index:'goodsOrigin', width:60, editable:true, editrules:{edithidden: true}, hidden:true},
						{name:'originName', index:'originName', width:60, editable:true, edittype:'select', editoptions:{value:"贸易商:贸易商"}},
						{name:'goodsContractreadtime',index:'goodsContractreadtime', width:60, sorttype:"date", unformat:pickDate},
						{name:'dzPurchaseContractNum',index:'dzPurchaseContractNum', width:60, editable:true, edittype:'select', editoptions:{value:getDzContractNum()}},
						{name:'groupPurchaseContractNum',index:'groupPurchaseContractNum', width:60, editable:true, edittype:'select', editoptions:{value:getGroupContractNum()}},
						//{name:'goodsDetail',index:'goodsDetail', width:60, sortable:false,editable: false, editoptions:{rows:"2",cols:"10"}, formatter:function(cellvalue, options, rowObject){ return '<a href="orderDetail.html">详情</a>'; }}
						{name:'checkAttachment',index:'checkAttachment', width:60, sortable:false, editable:false, formatter:function(cellvalue, options, rowObject){return "<a href=\"../attachment/checkAttachment.html\">查看附件</a>";}},
						{name:'goodsDetail',index:'goodsDetail', width:60, sortable:false, editable:false, formatter:function(cellvalue, options, rowObject){return "<a href=\"../orderDetail/orderDetail.html\">详情</a>";}}
					], 
			
					//footerrow: true,//分页上添加一行，用于显示统计信息
					rownumbers:true,//添加左侧行号
					viewrecords : true,		//定义是否要显示总记录数
					rowNum:10,				//在grid上显示记录条数，这个参数是要被传递到后台
					rowList:[10,20,30],		//一个下拉选择框，用来改变显示记录数，当选择时会覆盖rowNum参数传递到后台
					pager : pager_selector,	//定义翻页用的导航栏，必须是有效的html元素。翻页工具栏可以放置在html页面任意位置
					altRows: true,			//设置为交替行表格,默认为false
					prmNames:{			//Default valuesprmNames: {page:“page”,rows:“rows”, sort: “sidx”,order: “sord”, search:“_search”, nd:“nd”, npage:null} 当参数为null时不会被发到服务器端
						page:"page",		//设置初始的页码(默认值：1) 
						rows:"rows",
						oper:"oper",
						editoper:"edit",
						addoper:"add",
						deloper:"del",
					},
					//toppager: true,
					
					multiselect: true,			//定义是否可以多选
					//multikey: "ctrlKey",		//只有在multiselect设置为ture时起作用，定义使用那个key来做多选。shiftKey，altKey，ctrlKey
			        multiboxonly: true,			//只有当multiselect = true.起作用，当multiboxonly 为ture时只有选择checkbox才会起作用
			        
			        gridComplete:function(){ //在此事件中循环为每一行添加修改和删除链接 

						var ids=jQuery("#grid-table").jqGrid('getDataIDs'); 						
						for(var i=0; i<ids.length; i++){ 
							var id=ids[i]; 
 		                    /* uploadAttachmentHref = "<a href='#' style='color:#f60' onclick='uploadAttachment("+ id +")' >上传附件</a>";
		                    jQuery("#grid-table").jqGrid('setRowData', ids[i], {uploadFile: uploadAttachmentHref}); */ 	
							jQuery("#grid-table").jqGrid('setRowData', ids[i], {goodsOrigin: "贸易商"});
						} 
					},
			
					loadComplete : function() {
						var table = this;
						setTimeout(function(){
							styleCheckbox(table);
							
							updateActionIcons(table);
							updatePagerIcons(table);
							enableTooltips(table);
						}, 0);
					},
			
					editurl: "goods_editGoods.do",	//定义对form编辑时的url
					caption: "物资信息列表",		//表格名称
					autowidth: true				//如果为ture时，则当表格在首次被创建时会根据父元素比例重新调整表格宽度。如果父元素宽度改变，为了使表格宽度能够自动调整则需要实现函数：setGridWidth
				});
});