jgrid数据加载完成用input或者select框修饰

19 篇文章 0 订阅

在jqgrid加载完以后直接出现input框可以通过gridComplete的事件进行修改grid。

主要思路是:

1、获取jqgrid的id数组(jqgrid是通过id获取一行的值的,如果在你的colModel没有id,就会出现显示问题,这点大家必须注意,每一个jqgrid都要有自己id。

2. 通过id数组的长度来循环grid

3.使用'getRowData'方法利用id获取该id行的数据

4.通过列名来获取该列的值比如recrod.id 是获取该记录的id值,json数据格式

5、拼接input串,并把原来的值赋给input的value值

6.在通过'setRowData'方法,把拼接后的input框传递给jqgird的列。

如果select或者textarea都可以使用如上步骤进行替换。

gridComplete:function(){
		        	var rowIds = $("#phaseTypeList").getDataIDs();
					for(var i=0;i<rowIds.length;i++){
						var record = $("#phaseTypeList").jqGrid('getRowData', rowIds[i]);
						var unitPrice = record.unitPrice;
						var varTemp = '<input name=\'unitPrice\' type=\'text\' class=\'number\' οnblur=\'javascript:changePrice(this);\' recordId =\'' +rowIds[i]+ '\' value=\''+ unitPrice+'\'/>';
						jQuery("#phaseTypeList").jqGrid('setRowData', rowIds[i], {unitPrice:varTemp});
						
						var varTempid = '<input name=\'id\' type=\'text\' style=\'border:0px\'  readonly=\'readonly\' value=\''+ record.id+'\'/>';
						jQuery("#phaseTypeList").jqGrid('setRowData', rowIds[i], {id:varTempid});
						
						var varTemp1 ="<input id=\"submitTime\" name=\"submitTime\" type=\"text\" value=\""+record.submitTime+"\" onClick=\"WdatePicker({dateFmt:'yyyy-M-d',minDate:'%y-%M-%d'})\"/>";
						jQuery("#phaseTypeList").jqGrid('setRowData', rowIds[i], {submitTime:varTemp1});
						
						var needNum = record.needNum;
						var proceSheetValue=0;
						if((unitPrice!=null || unitPrice != undefined) && (needNum!=null || needNum != undefined)){
							proceSheetValue=parseFloat(needNum)*parseFloat(unitPrice);
							totalPrice=+proceSheetValue;
						}
						var varTempSum = '<input name=\'sum\' value=\''+proceSheetValue+'\' style=\'border:0px\'  readonly=\'readonly\' />';
						jQuery("#phaseTypeList").jqGrid('setRowData', rowIds[i], {sum:varTempSum});
						
						var varTemp2 = '<input name=\'priceSheet\'  class="btn06_2"/>';
						jQuery("#phaseTypeList").jqGrid('setRowData', rowIds[i], {priceSheet:varTemp2});
						}
						$("#priceTotal").val(totalPrice);
				}

效果图如下:

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值