【JQuery easyui】 $.modalDialog 内嵌的页面form表单发起ajax请求处理

昨天下午某项目遇到一个问题，modalDialog内嵌的页面使用form表单发起ajax请求，原来的代码是在$.modalDialog组件设置一个提交按钮，但是奇怪的问题现象是，后台返回的响应json却接收不到，于是我就想到了，由于是内嵌的页面发起form表单请求，响应应该返回到该内嵌页面才能够做处理，于是就研究了很长时间，最终问题解决。

   先来看下原来的代码：

	var dialog  = $.modalDialog({
					title : '修改信息',
					width : 400,
					height : 450,
					href : 'edit.jsp',
					resizable : true,
					onLoad : function() {
						var f = $.modalDialog.handler.find("#form");
						if (result.rows) {
							var data = result.rows[0];
							f.form('load', data);
							transDetailTemp.edit_currency = data.currency;
							transDetailTemp.edit_direction = data.direction;

							transDetailTemp.init();
						}
					},
					buttons : [
							{
								text : '提交',
								iconCls:'icon-edit',
								handler : function() {
									$.modalDialog.openner = $grid;
									    $('#form').form('submit', { 
      url: baseUrl+ "/importDetail", 
      onSubmit: function () {        //表单提交前的回调函数 
        var isValid = $(this).form('validate');//验证表单中的一些控件的值是否填写正确，比如某些文本框中的内容必须是数字 
        if (!isValid) { 
        } 
        return isValid; // 如果验证不通过，返回false终止表单提交 
      }, 
      success: function (data) {  //表单提交成功后的回调函数 
        $.modalDialog.handler.dialog('destroy');
                  $.modalDialog.handler = undefined;
                      $.messager.show({
                          title : '提示',
                          msg: data.desc ? data.desc : data.retMsg
         });
      } 
}); 

								
								}
							}, 
							{
								text : '取消',
								iconCls : 'icon-cancel',
								handler : function() {
									$.modalDialog.handler.dialog('destroy');
									$.modalDialog.handler = undefined;
								}
							} 
					]
				});

根据上面的代码我做了调整

var dialog  = $.modalDialog({
					title : '修改信息',
					width : 400,
					height : 450,
					href : 'edit.jsp',
					resizable : true,
					onLoad : function() {
						var f = $.modalDialog.handler.find("#form");
						if (result.rows) {
							var data = result.rows[0];
							f.form('load', data);
							transDetailTemp.edit_currency = data.currency;
							transDetailTemp.edit_direction = data.direction;

							transDetailTemp.init();
						}
					},
					buttons : [
							{
								text : '提交修改',
								iconCls:'icon-edit',
								handler : function() {
									$.modalDialog.openner = $grid;
									editPlus();
								}
							}, 
							{
								text : '取消',
								iconCls : 'icon-cancel',
								handler : function() {
									$.modalDialog.handler.dialog('destroy');
									$.modalDialog.handler = undefined;
								}
							} 
					]
				});

在edit.jsp页面我写了个函数：

function editPlus(){
	 	$.ajax({
				type : 'POST',
				url : baseUrl+ "/importDetail",
				data : JSON.stringify({
					transDate : $('#transDate').val(),
					transTime : $('#transTime').val(),
					flowNo : $('#flowNo').val()
					
				}),
				dataType : "json",
				contentType : "application/json;charse=UTF-8",
				success : function(data) {
					$.modalDialog.handler.dialog('destroy');
					$.modalDialog.handler = undefined;
						$.messager.show({
							title : '提示',
				            msg: data.desc ? data.desc : data.retMsg
						});
				},  
			    error:function(data){
			    	console.log(data);
			        alert("网络错误,保存失败！");  
			    } 
		});
	}

这样既接收到后台响应，又可以把对话框关闭，并且弹出我们需要的提示信息。