在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\' onblur=\'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); }