layui 弹出层layer中from初始化 ,并在btn中返回from.data

1.弹出对话框

layer.open() 来初始化弹层

 // 监听添加操作
        $(".data-add-btn").on("click", function () {
            var that = this;
            //多窗口模式，层叠置顶
            layer.open({
                type: 2 //此处以iframe举例
                , title: '添加机构信息'
                , area: ['690px', '460px']
                , shade: 0.5
                , maxmin: true
                , offset: "auto"
                , content: './from_add.html'
                , btn: ['确定'] //只是为了演示
                , yes: function (index, layero) {
                    var body = layer.getChildFrame('body', index);
                    var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method();
                    //console.log(body.html()) //得到iframe页的body内容
                    //var data1 = iframeWin.getfrom();
                    console.log(iframeWin.layui.form.val('example'));   //这里只有layui 2.5.5的时候可以取到值
                    layer.closeAll();
                }
                , zIndex: layer.zIndex //重点1
                , success: function (layero,index) {
                    var body = layer.getChildFrame('body', index);
                    var iframeWin = window[layero.find('iframe')[0]['name']];
                    //body.find("#username")[0].value='Hi，我是从父页来的';
                    var dd={
                        "password": "123456"
                        , "interest": 1
                        , "like[write]": true //复选框选中状态
                        , "close": true //开关状态
                        , "sex": "女"
                        , "desc": "我爱 layui"
                    };
                    iframeWin.loadfrom(dd);
                }
            });
        });

2.在context的html中定义环视 loadform 并传值

 注：这里测试发现，如果 给from直接传形参如：form.val('example', data); 会初始化失败，form 中没有数据但是不报错，但是序列化，反序列化后成功（估计是这个对象直接初始化有问题，layui这里有bug）

    var loadfrom =function loaddata(data){
        var dd2=  JSON.stringify(data);
        var ddd = JSON.parse(dd2);
        layui.form.val('example', ddd);

        // layui.use(['form'], function () 
        // {
        //     var form =layui.form;
        //     var ddd = JSON.parse(dd2);
        //     form.val('example', ddd);
        // });
    };

 

注：弹出的窗口时官方示例：注意是：layui-form

<form class="layui-form" action="" lay-filter="example">
    <div class="layui-form-item">
        <label class="layui-form-label">输入框</label>
        <div class="layui-input-block">
            <input type="text" name="username" id="username" lay-verify="title" autocomplete="off" placeholder="请输入标题" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">密码框</label>
        <div class="layui-input-block">
            <input type="password" name="password" placeholder="请输入密码" autocomplete="off" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">选择框</label>
        <div class="layui-input-block">
            <select name="interest" lay-filter="aihao">
                <option value=""></option>
                <option value="0">写作</option>
                <option value="1">阅读</option>
                <option value="2">游戏</option>
                <option value="3">音乐</option>
                <option value="4">旅行</option>
            </select>
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">复选框</label>
        <div class="layui-input-block">
            <input type="checkbox" name="like[write]" title="写作">
            <input type="checkbox" name="like[read]" title="阅读">
            <input type="checkbox" name="like[daze]" title="发呆">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">开关</label>
        <div class="layui-input-block">
            <input type="checkbox" name="close" lay-skin="switch" lay-text="ON|OFF">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">单选框</label>
        <div class="layui-input-block">
            <input type="radio" name="sex" value="男" title="男" checked="">
            <input type="radio" name="sex" value="女" title="女">
        </div>
    </div>
    <div class="layui-form-item layui-form-text">
        <label class="layui-form-label">文本域</label>
        <div class="layui-input-block">
            <textarea placeholder="请输入内容" class="layui-textarea" name="desc"></textarea>
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
        </div>
    </div>
</form>