layui 弹出层回调获取弹出层数据

最近在做毕业设计时遇到一个需求，需要在筛选表格数据时做一个速查功能，然后弹出层获取数据回调在筛选条件中，如图

image.png image.png

1 弹出层js代码

$(function () {

getGrid();

    //状态参数改变时重新加载表格

    $("#cpt_status").change(function () {

getGrid();

    });

});

/**

* 搜索

*/

function search() {

getGrid();

}

/**

* 加载表格

*/

function getGrid() {

layui.use('table', function () {

var table =layui.table;

        //搜索参数

        var status =$("#cpt_status").val();

        var name =$("#cpt_name").val();

        table.render({

elem:'#cpt_index'

            , height:400

            , url:'/fastsearch/cpt/getData?status=' + status +'&name=' + name//数据接口

            , page:true //开启分页

            , even:true //隔行着色

            , totalRow:true

            , title:'竞赛项目'

            , limit:10

            , limits: [10, 50, 100]

, align:'right'

            , cols: [[//表头

                {type:'checkbox', fixed:'left'}

, {field:'serial', title:'序号', width:80, fixed:'left', type:'numbers'}

, {field:'id', title:'ID', width:200, fixed:'left', hide:true}

, {field:'name', title:'名称', width:263}

, {field:'place', title:'竞赛地点', width:100}

, {field:'status', title:'竞赛状态', width:100}

, {field:'holdTime', title:'竞赛时间', width:200}

]]

});

    });

}

/**

* 返回选择的数据

*/

var callbackData =function () {

var table =layui.table;

    var checkStatus = table.checkStatus("cpt_index");

    if (checkStatus.data.length >1) {

var data ="false";

    }else if (checkStatus.data.length ==1) {

var data = {

id: checkStatus.data[0].id,

            name: checkStatus.data[0].name

        };

    }else {

var data ="";

    }

return data;

};

2 主页面回调代码

/**
 * 速查
 */
function searchCpt() {
    layer.open({
        title: "项目速查",
        closeBtn: 2,
        area: ['800px', '600px'],
        type: 2,
        content: '/fastsearch/cpt/index',
        btn: ['确定', '关闭'],
        yes: function (index) {
            //当点击‘确定’按钮的时候，获取弹出层返回的值
            var res = window["layui-layer-iframe" + index].callbackData();
            if (res != null || res != '') {
                if (res == 'false') {
                    layer.msg('请选择一条数据');
                    return;
                } else {
                    $("#cpName").val(res.name);
                    $("#cptId").val(res.id);
                }
            }
            //最后关闭弹出层
            layer.close(index);
        }
    });

这样就可以完成了