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>