DWZ中dialog层的刷新

　　在DWZ开发过程中经常会遇到的一种情况就是：在navTab页面中通过a标签打开一个dialog，在dialog层进行操作后，需要对该dialog层进行必要的刷新操作。我将方法整理在这里，请需要学习的孩子们看看哦。

1.首先讲一下思路：

　在非dialog页面中，也就是navTab页面中，将传递rel的值作为刷新的途径。在那种情况下，rel值为navTab的navTabId，所以在dialog中，只要将dialogId获取到，并作为rel值在dialog层传递即可。

2.其次给大家看看我的操作图：

图1-点击navTab上的修改，进入一级dialog页面

图2-点击一级dialog的修改操作，进入二级dialog的详情修改页面

说明：我的操作就是：打开navTab上的修改页面，显示一个dialog层的列表信息，然后再在一级dialog上点击修改，打开二级dialog，在二级dialog上修改完毕后，关闭当前的二级dialog，然后刷新一级dialog。

3.步骤：

（1）在a链接中指定rel值（即将打开的dialog层的ID）：

<a href ="score.do?method=goQueryRuleDetail" target="dialog" rel="firstDialogId"  width="950" height="380"  title="标题">修改</a>

（2）在dwz.dialog.js中修改部分代码（$.pdialog上一行）：

var currentDialogId = "";//2013-07-19 lucky add

• 找到 open:function(url, dlgid, title, options)，给刚刚声明的currentDialogId赋值

open:function(url, dlgid, title, options) {
    currentDialogId = dlgid;//新增部分，赋值
    var op = $.extend({},$.pdialog._op, options);    
    var dialog = $("body").data(dlgid);
        ……

• 在open节点之后，新增节点

,getcurrentDialogId:function(){//获取当前窗口ID
    return currentDialogId;
},

（3）一级dialog页面，修改链接：

<a href="score.do?method=goModifyPage" target="dialog" id="goToModify">修改</a>

• 给该修改链接添加rel值：

 <script type="text/javascript">
 $(function(){
     var currentDialogId = $.pdialog.getcurrentDialogId();//获取当前窗口的ID
     var tempHref = $("#goToModify").attr("href");
     $("#goToModify").attr("href",tempHref + "&rel="+currentDialogId);
 });
 </script>

（4）经过后台的传递，二级dialog页面也已经有rel的值了。此时，要写一个二级dialog提交后的回调函数。在dwz.ajax.js里面添加如下代码：

/**2013-07-19 lucky add
 * dialog层之上的dialog（二级dialog）表单提交回调函数
 * 服务器回转dialogId,可以重新载入指定的dialogId，statusCode=DWZ.statusCode.ok表示操作成功, 自动关闭当前dialog
 * form提交后返回json数据结构,json格式和navTabAjaxDone一致
 * @param json
 */
function dialogLayerAjaxDone(json){
    DWZ.ajaxDone(json);
    if (json.statusCode == DWZ.statusCode.ok){
        if (json.dialogId){
            var dialog = $("body").data(json.dialogId);
            $.pdialog.reload(json.forwardUrl, {dialogId: json.dialogId});
        }
        $.pdialog.closeCurrent();
    }
}

（5）二级dialog表单form回调函数：

onsubmit="return validateCallback(this, dialogLayerAjaxDone);"

注：二级dialog提交至后台后，后台需指定forwardUrl(重载URL)和dialogId（需要刷新的一级dialogId），返回的JSON数据格式为：

{
    "statusCode":"",//状态代码
    "message":"",
    "dialogId":"",//需要刷新的一级dialogId
    "callbackType":"",
    "forwardUrl":"",
    "url":"",
    "urldata":""
}

到这里差不多结束了。有问题的再用firebug调试调试吧。

学习建议：

• 不要以自己看不懂js代码为借口就不去看源码，不看永远不会
• 有问题找demo，找文档；自己先尝试着解决