layui之彈出層關閉和重新整理問題

本篇文章是根據本人實際開發的例子來講的，不一定適用各位看官的情況

描述：

主頁面，彈出第一個彈框，第一個彈框中在彈出第二個彈框，如圖：

1是主頁面，2是子彈窗，3是孫彈窗

功能一：好了，第一個我要實現的功能是點選彈窗3的確定之後關閉彈窗3

上js程式碼，先貼出如何在主頁面1中彈出彈窗2的程式碼：

//彈窗2（程式碼寫在主頁面1）
function edit() {

var index = layer.open({//佔坑！！！
            type : 2,
            title : "預算目標編輯",
            content : "/xx/xx/xx/edit?year=" + year
                    + "&departmentCode=" + departmentCode,
            area : [ "90%", "90%" ],
        });

}

接著貼出如何在彈窗2中彈出彈窗3的：

//彈窗3（js程式碼寫在彈窗2中）

function configuration(){
    parent.layer.open({//佔坑！
        type: 2,
        title: "配置專案",
        content: "/xx/xx/xx/xx?budgetMainCode="+budgetMainCode,
        area: ["80%", "80%"],
        end: function () {//點睛之筆，此端程式碼便是精髓之處，layui監聽到彈窗3的銷燬之後回調了一個end函式，通過這個end函式我們就能重新整理彈窗2的資料
            refreshTable()//就比如這refreshTable()是彈窗2裡面的用於拼接資料列表的函式

} }); }

//確定（程式碼寫在彈窗3中）
//彈窗3中的js程式碼，就是最上面那個圖中的確定按鈕的函式

function comfirm(){
    //獲取checkbox[name='check']的值
 var arr = new Array();
 $("input:checkbox[name='check']:checked").each(function(i){
  arr[i] = $(this).val();
 }); 
    $.ajax({
        type: "post",
        dataType: 'json',
        url: "/xx/xx/xx/checkChoise?budgetMainCode="+budgetMainCode,
        contentType: 'application/json',
        data: JSON.stringify(arr),
        success: function (result) {//點選確定按鈕之後，後臺業務程式碼出來成功之後的回撥
            if (result.status == 0) {
                parent.layer.close(parent.layer.index);//根據前面怎麼彈出彈窗來選擇索引去關閉彈窗，比如前面彈窗3是通過parent.layer.open彈出來的，
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　那麼我就獲取它的索引，並將它關閉，佔坑！！！
            }
            if (result.message != null) {
                layer.msg(result.message)
            }
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            layer.msg('{"status":"' + XMLHttpRequest.status + '","readyState":"' + XMLHttpRequest.readyState + '","textStatus":"' + textStatus + '","errorThrown":"' + errorThrown + '"}')
        }
    })
}

功能二：

需求是點選彈窗3的某一條資料的“專案模板”然後選好該條模板在後臺把這條模板插入到另外一個表裡面

，這裡面的另外一個表指的是彈窗2中的一個數據表格。彈窗2的資料表格在彈窗3關閉的瞬間然後插入一條新的資料，此時彈窗2的那個資料表格肯定要立馬重新整理

//彈窗3（js程式碼寫在彈窗2中）

function configuration(){
    parent.layer.open({//佔坑！
        type: 2,
        title: "配置專案",
        content: "/xx/xx/xx/xx?budgetMainCode="+budgetMainCode,
        area: ["80%", "80%"],
        end: function () {//點睛之筆，此端程式碼便是精髓之處，layui監聽到彈窗3的銷燬（視窗關閉）之後回調了一個end函式，通過這個end函式我們就能重新整理彈窗2的資料
            refreshTable()//就比如這refreshTable()是彈窗2裡面的用於拼接資料列表的函式
} }); }

如圖彈窗2：

確定之後選擇了這條模板資料，同時關閉彈窗3，效果如圖：