jqgrid的动态下拉框实现,并解决不能获取值的问题

3 篇文章 0 订阅

使用jqgrid,要实现在单元格中的动态下拉框,废话不多说,上代码:

var gridOption = $("#inLineItemEditList").jqGrid({
			url: path,
			mtype: "get",				/* ajax提交方式 */
			postData:
				{
					opertype: this.globalParam.operType,
					entitydataid: this.globalParam.entityDataID,
				},							/* 提交参数 */
			datatype: "json",			/* 返回数据格式 */
			prmNames:					/* 避免发送不必要的参数到服务端 */
				{
					page: null,			/* 开始页数 */
					rows: null,			/* 开始行数 */
					search: null,
					nd: null,
					sort: null,
					order: null
				},
			jsonReader: mc.grid.ExtJsonReader,
			beforeProcessing: $.proxy(function (data, status, xhr) {
				if (data.success) {
					this.data = data.data;
					this.isLoaded = true;
				}
			}, this),
			rownumbers: true,
			cmTemplate:
				{
					sortable: false
				},
			cellEdit: true,
			cellsubmit: "clientArray",
			colNames: ["hotelid","住宿及伙食补助费","费用明细","人数","天数","金额(元)","核准金额(元)"],
			colModel : [			/* 列设置 */
				{name : "hotelid",label : "id",editable:false,hidden:true,key:true},
				{name : "hotelfare", align:"center", width : 80, editable: true, edittype:'select',
					formatter:'select',editoptions: {value: "0:住宿费;1:伙食补助"}},
				{name : "hotelfaredetail",align:"center",width:80,editable: false, edittype:'select',
					formatter:'select',editoptions: {value: "0:大区职;1:军级;2:师级;3:其他人员;4:途中伙食补助;5:住勤伙食补助;6:误餐补助;7:"}},
				{name : "persionnumber", width:80, align : "center", editable:true, edittype:'text',formatter: "number",
					formatoptions: {thousandsSeparator:",", defaulValue:"",decimalPlaces:0}},
				{name : "days", width:80, align : "center", editable:true, edittype:'text',formatter: "number",
					formatoptions: {thousandsSeparator:",", defaulValue:"",decimalPlaces:0}},
				{name: "normalmoney",width: 80,align : "center", editable:false, edittype:'text',formatter: "number",
					formatoptions: {thousandsSeparator:",", defaulValue:"",decimalPlaces:2}},
				{name: 'hotelmoney', width: 80,align : "center", editable:false, edittype:'text',formatter: "number",
					formatoptions: {thousandsSeparator:",", defaulValue:"",decimalPlaces:2}}
			],
			afterSaveCell : function (rowid, name, val, iRow, iCol) {
				//价款
				if (name == 'hotelfare') {
					//var hotelfare = jQuery("#inLineItemEditList").jqGrid('getCell', rowid, 'hotelfare');
					if (val == '0') {
						$("#inLineItemEditList").setColProp("hotelfaredetail", {editable: true});
						$("#inLineItemEditList").jqGrid('setRowData', rowid, {hotelfaredetail: 7});
						$('#inLineItemEditList').setColProp('hotelfaredetail', {editoptions: {value: "0:大区职;1:军级;2:师级;3:其他人员"}});
					} else {
						$("#inLineItemEditList").setColProp("hotelfaredetail", {editable: true});
						$("#inLineItemEditList").jqGrid('setRowData', rowid, {hotelfaredetail: 7});
						$('#inLineItemEditList').setColProp('hotelfaredetail', {editoptions: {value: "4:途中伙食补助;5:住勤伙食补助;6:误餐补助"}});
					}
				}
			  //天数
			  if (name == 'days') {
				  var hotelfaredetail = jQuery("#inLineItemEditList").jqGrid('getCell', rowid, 'hotelfaredetail');
				  var persionnumber = jQuery("#inLineItemEditList").jqGrid('getCell', rowid, 'persionnumber');
				  if (hotelfaredetail != "") {
					  if (persionnumber != 0.00) {
						  switch (parseFloat(hotelfaredetail)) {
							  case 0: {
								  setNormalmoneyAndHotelmoney(allEnum.hotelType.DQZ,persionnumber,val,rowid);
								  return;
							  }
							  case 1: {
								 setNormalmoneyAndHotelmoney(allEnum.hotelType.JJ,persionnumber,val,rowid);
								  return;
							  }
							  case 2:{
								  setNormalmoneyAndHotelmoney(allEnum.hotelType.SJ,persionnumber,val,rowid);
								  return;
							  }
							  case 3:{
								  setNormalmoneyAndHotelmoney(allEnum.hotelType.QT,persionnumber,val,rowid);
								  return;
							  }
							  case 4:{
								  setNormalmoneyAndHotelmoney(allEnum.hotelType.TZHS,persionnumber,val,rowid);
								  return;
							  }
							  case 5:{
								 setNormalmoneyAndHotelmoney(allEnum.hotelType.ZQHS,persionnumber,val,rowid);
								  return;
							  }
							  case 6:{
								  setNormalmoneyAndHotelmoney(allEnum.hotelType.WCBZ,persionnumber,val,rowid);
								  return;
							  }
						  }
					  }
			     }else {
				  	mc.msg("请先选择费用明细");
				  }
			  }
			  //人数
			  if (name == 'persionnumber') {
				  var hotelfaredetail = $("#inLineItemEditList").jqGrid('getCell', rowid, 'hotelfaredetail');
				  var days = $("#inLineItemEditList").jqGrid('getCell', rowid, 'days');
				if(hotelfaredetail != "") {
					if (days != 0.00) {
						switch (parseFloat(hotelfaredetail)) {
							case 0: {
								setNormalmoneyAndHotelmoney(allEnum.hotelType.DQZ,days,val,rowid);
								return;
							}
							case 1: {
								setNormalmoneyAndHotelmoney(allEnum.hotelType.JJ,days,val,rowid);
								return;
							}
							case 2:{
								setNormalmoneyAndHotelmoney(allEnum.hotelType.SJ,days,val,rowid);
								return;
							}
							case 3:{
								setNormalmoneyAndHotelmoney(allEnum.hotelType.QT,days,val,rowid);
								return;
							}
							case 4:{
								setNormalmoneyAndHotelmoney(allEnum.hotelType.TZHS,days,val,rowid);
								return;
							}
							case 5:{
								setNormalmoneyAndHotelmoney(allEnum.hotelType.ZQHS,days,val,rowid);
								return;
							}
							case 6:{
								setNormalmoneyAndHotelmoney(allEnum.hotelType.WCBZ,days,val,rowid);
								return;
							}
						}
					}
				}else{
					mc.msg("请先选择费用明细");
				}
			  }
			},
			beforeEditCell : function (rowid, name, val, iRow, iCol) {
				    if (name == 'hotelfaredetail') {
                        var hotelfare = jQuery("#inLineItemEditList").jqGrid('getCell', rowid, 'hotelfare');
                        if(hotelfare =="" || hotelfare == 'undefined'){
                            mc.msg("请先选择住宿及伙食补助费")
                        }
				}
			}
		});
		$("#inLineItemEditList").jqGrid(gridOption);

效果如下:
在这里插入图片描述
$(’#inLineItemEditList’).setColProp(‘hotelfaredetail’, {editoptions: {value: “4:途中伙食补助;5:住勤伙食补助;6:误餐补助”}});
这是主要实现动态下拉框的方法;

注:
这样设置后页面没有问题,但是在通过getRowData()获取值时会出现获取不到值的问题,因此需要在调用getRowData()方法之前将所有的下拉框的值都加入进去如下:
$(’#inLineItemEditList’).setColProp(‘hotelfaredetail’, {editoptions: {value: “0:大区职;1:军级;2:师级;3:其他人员;4:途中伙食补助;5:住勤伙食补助;6:误餐补助;7:”}});

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值