jqGrid 行编辑（select事件）动态追加控件（操作）

[img]http://dl2.iteye.com/upload/attachment/0101/1539/5c38f0fa-9419-3d9e-8be0-d90d99c2ee38.png[/img]

[img]http://dl2.iteye.com/upload/attachment/0101/1541/49c85298-d386-3c85-befd-320c2e791efb.png[/img]


在某个控件后面， 追加一个控件， 在某个控件下面设置change事件即可。
但需要注意，如果用到jqGrid的行编辑， 表单中新增的属性无法提交给后台， 想解决这个问题，需要在editGridRow的options中重新设置postdata

如下：

jqGrid表格配置

{
					name : 'attrType',
					index : 'ATTR_TYPE',
					editable:true,
					formatter: function(cellvalue, options, rowObject) {
						var attrType = "";
						if(cellvalue == "1"){
							attrType = "文本";
						}else{
							attrType = "数据字典";
						}
						return attrType;
					},
					editable:true,
					edittype:'select', 
					editoptions:{
						value:"1:文本;0:数据字典",
						dataEvents: [{type:'change',fn:function(e){
							//TODO 下拉后增加后，选择数据字典项目 

							$('#dataItemSpan').html('');
							var $attrTypeSel = $( e.target );
							var attrType = $attrTypeSel.val();
							if (attrType == 0) {
								$attrTypeSel.after('<span id="dataItemSpan"> 数据项：<select id="rule" class="FormElement" role="select"><option value="ttt">tt</option></select></span>');
							}
						}}]
					},
					formoptions:{colpos:1,rowpos:3,elmsuffix:'<font color="red" >*</font>'}

var editDialogOptions = {
top: $(window).height()/4,
    left: $(window).width()/3,
    addCaption: "新增属性",
    editCaption: "编辑属性",
    ......
beforeSubmit : function(postdata, formid) {
		if ($('#rule').length != 0) {
			postdata["attribute.rule"] = $('#rule').val();//Reset data of the rule.
		}
		return[true,"sucessful"];
    }
}
var rowid = jQuery("#attributeList").jqGrid("getGridParam", "selrow");//selarrrow
jQuery("#attributeList").jqGrid('editGridRow',rowid, editDialogOptions);