【Layui】子页面向父级页面传递参数

简介: 【Layui】子页面向父级页面传递参数

author:咔咔

wechat:fangkangfk

案例:

底层是父级页面,上边是子页面,子页面需要将选择的ID传递给父级页面

image.png


首先需要在父级页面写open打开子页面

content是子页面地址

image.png

var type_id;
    layui.use(['laypage', 'layer','form'], function() {
        var laypage = layui.laypage
            , layer = layui.layer,
            form = layui.form;
        form.on('select(type_mid)', function(data){
            type_id = data.value;
        })
    });
    function show_layer(){
        layer.open({
            type: 2,
            area: [1000+'px', 1000+'px'],
            fix: false, //不固定
            maxmin: true,
            shadeClose: true,
            shade:0.4,
            title: '扩展分类',
            content: 'type?type_id='+type_id,  //url 为子布局的url路径
            success:function (layero,index) {
               console.log('我是咔咔')
            }
        });
    }


屏幕快照 2022-05-12 下午10.59.28.png屏幕快照 2022-05-12 下午10.59.40.png屏幕快照 2022-05-12 下午10.59.49.png

相关文章
layer 弹出框(iframe层)父子页面传值
layer 弹出框(iframe层)父子页面传值
393 0
|
JavaScript 前端开发 开发者
Layui layer 弹出层的使用【笔记】
本文介绍了Layui的layer弹出层组件的使用方法,包括如何通过在线CDN引入Layui的CSS和JS文件,以及如何使用layer.open(options)开启弹出层和layer.close(index)关闭弹出层。文章详细说明了弹出层类型的分类、options选项的参数配置,以及回调函数的使用。通过示例代码,展示了如何创建不同类型的弹出层,包括对话信息框、页面层、内联框架层、加载层和tips层。
|
JavaScript Java 数据格式
Layui数据表格(table)前后台交互
Layui数据表格(table)前后台交互
890 0
|
JavaScript 前端开发
layui用layer.open打开子页面并获取子页面的ueditor富文本编辑器的内容
该内容描述了一个Web应用的交互流程,其中父页面通过调用子页面的JavaScript函数来获取富文本编辑器的内容。子页面包含一个富文本编辑器和一个`callbackdata`函数,用于返回编辑器的文本内容。父页面使用`layer.open`打开子页面作为弹窗,并在用户点击提交时,访问子页面的`callbackdata`获取编辑器内容,同时检查其他表单字段,如类型、标题等是否为空,以确保数据完整。
1189 0
layui表单select框同时支持下拉和输入的解决方案
layui表单select框同时支持下拉和输入的解决方案
1115 0
|
JSON 前端开发 Java
layui上传图片,前端直接拷代码,后端……
layui上传图片,前端直接拷代码,后端……
|
JavaScript 前端开发
layui复选框checkbox全选和获取值的解决方案
layui复选框checkbox全选和获取值的解决方案
2440 0
|
前端开发 JavaScript 数据库
layui联动菜单搜索select表单选项的设置方法
layui联动菜单搜索select表单选项的设置方法
1237 0
|
JavaScript
Layui 内置方法 - layer.getChildFrame( 获取iframe页的DOM)
Layui 内置方法 - layer.getChildFrame( 获取iframe页的DOM)
899 0

热门文章

最新文章

下一篇
开通oss服务