前一篇《layui之資料表格–與後臺互動獲取資料》介紹了layui資料表格如何獲取動態資料，接下來介紹下layui如何往彈出層子視窗傳遞表格資料

示例如圖：

點選編輯按鈕，彈出編輯彈出層，並顯示相應的編輯資料

這裡省略layui基礎的語法，直接介紹關鍵程式碼

//userList.js
//編輯使用者
function editUser(edit){
    var index = layui.layer.open({
        title : "編輯使用者",
        type : 2,
        content : "uIAction_page_user_userEdit"
 
,//彈出層頁面
        area: ['500px', '560px'],
        success : function(layero, index){
            var body = layui.layer.getChildFrame('body', index);
            if(edit){
                // 取到彈出層裡的元素，並把編輯的內容放進去
                body.find(".id").val(edit.id);  //將選中的資料的id傳到編輯頁面的隱藏域，便於根據ID修改資料
                body.find(".password"
 
).val(edit.password);  //密碼
                body.find(".userEndTime").val(edit.userEndTime);  //登入時間
                body.find(".userName").val(edit.userName);  //登入名
                body.find(".userEmail").val(edit.userEmail);  //郵箱
                body.find(".userSex input[value="+edit.userSex+"]").prop("checked"
 
,"checked");  //性別，單選按鈕
                body.find(".userGradeHide").val(edit.userGradeId);  //會員等級，注意：這裡我只把等級ID放到彈出層頁面的隱藏域，然後再使用ajax查詢等級列表，動態生成下拉列表
                body.find(".userStatus").val(edit.userStatus);    //使用者狀態
                body.find(".userDesc").text(edit.userDesc);    //使用者簡介
                // 記得重新渲染表單
                form.render();
            }
            setTimeout(function(){
                layui.layer.tips('點選此處返回使用者列表', '.layui-layer-setwin .layui-layer-close', {
                    tips: 3
                });
            },500)
        }
    })
    //layui.layer.full(index);//設定彈出層佈滿視窗
    //改變視窗大小時，重置彈窗的寬高，防止超出可視區域（如F12調出debug的操作）
    $(window).on("resize",function(){
        //layui.layer.full(window.sessionStorage.getItem("index"));
    })
}

彈出層表單的程式碼：

<form class="layui-form" style="width:80%;">
    <div class="layui-form-item layui-row layui-col-xs12">
        <label class="layui-form-label">登入名</label>
        <div class="layui-input-block">
            <!-- 使用隱藏域用於儲存編輯項的ID值，便於提交修改 -->
            <input type="hidden" class="id" name="id">
            <input type="hidden" class="password" name="password">
            <input type="hidden" class="userEndTime" name="userEndTime">
            <input type="text" class="layui-input userName" lay-verify="required" placeholder="請輸入登入名" disabled>
        </div>
    </div>
    <div class="layui-form-item layui-row layui-col-xs12">
        <label class="layui-form-label">郵箱</label>
        <div class="layui-input-block">
            <input type="text" class="layui-input userEmail" lay-verify="email" placeholder="請輸入郵箱">
        </div>
    </div>
    <div class="layui-row">
        <div class="magb15 layui-col-md4 layui-col-xs12">
            <label class="layui-form-label">性別</label>
            <div class="layui-input-block userSex">
                <input type="radio" name="userSex" value="男" title="男" checked>
                <input type="radio" name="userSex" value="女" title="女">
                <input type="radio" name="userSex" value="保密" title="保密">
            </div>
        </div>
        <div class="magb15 layui-col-md4 layui-col-xs12">
            <label class="layui-form-label">會員等級</label>
            <div class="layui-input-block">
                <!-- ajax動態生成等級列表 -->
                <select name="userGrade" class="userGrade" lay-filter="userGrade"></select>
                <!-- 使用隱藏域來儲存其他頁面傳過來的使用者等級ID -->
                <input type="hidden" class="userGradeHide" name="userGradeHide" />
            </div>
        </div>
        <div class="magb15 layui-col-md4 layui-col-xs12">
            <label class="layui-form-label">會員狀態</label>
            <div class="layui-input-block">
                <select name="userStatus" class="userStatus" lay-filter="userStatus">
                    <option value="0">正常使用</option>
                    <option value="1">限制使用</option>
                </select>
            </div>
        </div>
    </div>
    <div class="layui-form-item layui-row layui-col-xs12">
        <label class="layui-form-label">使用者簡介</label>
        <div class="layui-input-block">
            <textarea placeholder="請輸入使用者簡介" class="layui-textarea userDesc" name="userDesc"></textarea>
        </div>
    </div>
    <div class="layui-form-item layui-row layui-col-xs12">
        <div class="layui-input-block">
            <button class="layui-btn layui-btn-m" lay-submit="" lay-filter="editUser">修改</button>
            <button type="button" class="layui-btn layui-btn-m layui-btn-primary cancle_btn">取消</button>
        </div>
    </div>
</form>