案例

今天在用DWZ框架做新增功能時，發現在對話方塊儲存成功後，後端返回正確的json格式，但對話方塊不能自動關閉視窗，而且儲存後自動跳回主頁，沒有停留在當前使用者列表頁面，具體錯誤過程重現如下：

1.開啟使用者列表

2.點選新增按鈕

3.在開啟的新增對話視窗填入資訊後，點選儲存

4.新增成功後，對話方塊並沒有自動關閉，而且使用者列表也不見了

5.重新開啟使用者禮拜哦，可以看到剛才的資料已經成功儲存

6.後端返回的json格式也沒有問題

解決方案

為什麼會出現以上原因呢？原來是因為我在新增對話視窗頁面裡面配置的回撥函式方法配置錯了，填了navTabAjaxDone該方法，但是根據dwz框架手冊說明，對於dialog，應該 填入dialogAjaxDone，navTabAjaxDone該方法只針對面板視窗，錯誤示範如下：

對於dialog方式開啟的對話方塊，正確的回撥函式應該如下配置：

DWZ框架說明

對於navTab和dialog兩種開啟方式，後端返回的json資料結構是一樣的，但是回撥函式有所不同，如果沒有填入指定的navTabId,則預設跳回當前的navTab頁面，但是資料結構和navTab方式一致，其他可以填空字元創，但是記得填入setv("callbackType", "closeCurrent") ，否則當前對話方塊儲存成功會也不會自動關閉，以下是後端json資料樣例以及官方原始碼:

/**
 * navTabAjaxDone是DWZ框架中預定義的表單提交回調函式．
 * 伺服器轉回navTabId可以把那個navTab標記為reloadFlag=1, 下次切換到那個navTab時會重新載入內容. 
 * callbackType如果是closeCurrent就會關閉當前tab
 * 只有callbackType="forward"時需要forwardUrl值
 * navTabAjaxDone這個回撥函式基本可以通用了，如果還有特殊需要也可以自定義回撥函式.
 * 如果表單提交只提示操作是否成功, 就可以不指定回撥函式. 框架會預設呼叫DWZ.ajaxDone()
 * <form action="/user.do?method=save" onsubmit="return validateCallback(this, navTabAjaxDone)">
 * 
 * form提交後返回json資料結構statusCode=DWZ.statusCode.ok表示操作成功, 做頁面跳轉等操作. statusCode=DWZ.statusCode.error表示操作失敗, 提示錯誤原因. 
 * statusCode=DWZ.statusCode.timeout表示session超時，下次點選時跳轉到DWZ.loginUrl
 * {"statusCode":"200", "message":"操作成功", "navTabId":"navNewsLi", "forwardUrl":"", "callbackType":"closeCurrent", "rel"."xxxId"}
 * {"statusCode":"300", "message":"操作失敗"}
 * {"statusCode":"301", "message":"會話超時"}
 * 
 */
function navTabAjaxDone(json){
	DWZ.ajaxDone(json);
	if (json[DWZ.keys.statusCode] == DWZ.statusCode.ok){
		if (json.navTabId){ //把指定navTab頁面標記為需要“重新載入”。注意navTabId不能是當前navTab頁面的
			navTab.reloadFlag(json.navTabId);
		} else { //重新載入當前navTab頁面
			var $pagerForm = $("#pagerForm", navTab.getCurrentPanel());
			var args = $pagerForm.size()>0 ? $pagerForm.serializeArray() : {}
			navTabPageBreak(args, json.rel);
		}
		
		if ("closeCurrent" == json.callbackType) {
			setTimeout(function(){navTab.closeCurrentTab(json.navTabId);}, 100);
		} else if ("forward" == json.callbackType) {
			navTab.reload(json.forwardUrl);
		} else if ("forwardConfirm" == json.callbackType) {
			alertMsg.confirm(json.confirmMsg || DWZ.msg("forwardConfirmMsg"), {
				okCall: function(){
					navTab.reload(json.forwardUrl);
				},
				cancelCall: function(){
					navTab.closeCurrentTab(json.navTabId);
				}
			});
		} else {
			navTab.getCurrentPanel().find(":input[initValue]").each(function(){
				var initVal = $(this).attr("initValue");
				$(this).val(initVal);
			});
		}
	}
}

/**
 * dialog上的表單提交回調函式
 * 當前navTab頁面有pagerForm就重新載入
 * 伺服器轉回navTabId，可以重新載入指定的navTab. statusCode=DWZ.statusCode.ok表示操作成功, 自動關閉當前dialog
 * 
 * form提交後返回json資料結構,json格式和navTabAjaxDone一致
 */
function dialogAjaxDone(json){
	DWZ.ajaxDone(json);
	if (json[DWZ.keys.statusCode] == DWZ.statusCode.ok){
		if (json.navTabId){
			navTab.reload(json.forwardUrl, {navTabId: json.navTabId});
		} else {
			var $pagerForm = $("#pagerForm", navTab.getCurrentPanel());
			var args = $pagerForm.size()>0 ? $pagerForm.serializeArray() : {}
			navTabPageBreak(args, json.rel);
		}
		if ("closeCurrent" == json.callbackType) {
			$.pdialog.closeCurrent();
		}
	}
}