本篇文章是根据本人实际开发的例子来讲的,不一定适用各位看官的情况

描述:

主页面,弹出第一个弹框,第一个弹框中在弹出第二个弹框,如图:

1是主页面,2是子弹窗,3是孙弹窗

功能一:好了,第一个我要实现的功能是点击弹窗3的确定之后关闭弹窗3

上js代码,先贴出如何在主页面1中弹出弹窗2的代码:

//弹窗2(代码写在主页面1)
function edit() { var index = layer.open({//占坑!!!
type : 2,
title : "预算目标编辑",
content : "/xx/xx/xx/edit?year=" + year
+ "&departmentCode=" + departmentCode,
area : [ "90%", "90%" ],
}); }

接着贴出如何在弹窗2中弹出弹窗3的:

//弹窗3(js代码写在弹窗2中)
function configuration(){
parent.layer.open({//占坑!
type: 2,
title: "配置项目",
content: "/xx/xx/xx/xx?budgetMainCode="+budgetMainCode,
area: ["80%", "80%"],
end: function () {//点睛之笔,此端代码便是精髓之处,layui监听到弹窗3的销毁之后回调了一个end函数,通过这个end函数我们就能刷新弹窗2的数据
refreshTable()//就比如这refreshTable()是弹窗2里面的用于拼接数据列表的函数
} }); }
//确定(代码写在弹窗3中)
//弹窗3中的js代码,就是最上面那个图中的确定按钮的函数
function comfirm(){
 //获取checkbox[name='check']的值
     var arr = new Array();
     $("input:checkbox[name='check']:checked").each(function(i){
           arr[i] = $(this).val();
     });  
$.ajax({
type: "post",
dataType: 'json',
url: "/xx/xx/xx/checkChoise?budgetMainCode="+budgetMainCode,
contentType: 'application/json',
data: JSON.stringify(arr),
success: function (result) {//点击确定按钮之后,后台业务代码出来成功之后的回调
if (result.status == 0) {
parent.layer.close(parent.layer.index);//根据前面怎么弹出弹窗来选择索引去关闭弹窗,比如前面弹窗3是通过parent.layer.open弹出来的,
                                    那么我就获取它的索引,并将它关闭,占坑!!!
}
if (result.message != null) {
layer.msg(result.message)
}
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
layer.msg('{"status":"' + XMLHttpRequest.status + '","readyState":"' + XMLHttpRequest.readyState + '","textStatus":"' + textStatus + '","errorThrown":"' + errorThrown + '"}')
}
})
}

功能二:

需求是点击弹窗3的某一条数据的“项目模板”然后选好该条模板在后台把这条模板插入到另外一个表里面

,这里面的另外一个表指的是弹窗2中的一个数据表格。弹窗2的数据表格在弹窗3关闭的瞬间然后插入一条新的数据,此时弹窗2的那个数据表格肯定要立马刷新

//弹窗3(js代码写在弹窗2中)

function configuration(){
parent.layer.open({//占坑!
type: 2,
title: "配置项目",
content: "/xx/xx/xx/xx?budgetMainCode="+budgetMainCode,
area: ["80%", "80%"],
end: function () {//点睛之笔,此端代码便是精髓之处,layui监听到弹窗3的销毁(窗口关闭)之后回调了一个end函数,通过这个end函数我们就能刷新弹窗2的数据
refreshTable()//就比如这refreshTable()是弹窗2里面的用于拼接数据列表的函数
} }); }

如图弹窗2:

确定之后选择了这条模板数据,同时关闭弹窗3,效果如图:

layui之弹出层关闭和刷新问题的更多相关文章

  1. Layer弹出层关闭后刷新父页面

    API地址:http://layer.layui.com/api.html#end 调用END回调方法: end - 层销毁后触发的回调 类型:Function,默认:null 无论是确认还是取消,只 ...

  2. layui如何自定义弹出层关闭事件

    在某些业务场景下,我们需要自定义弹出层关闭事件,代码示例如下: layui.use('layer', function () { var layer = layui.layer; layer.open ...

  3. layui如何隐藏弹出层关闭的按钮

    layui默认弹出层是带有关闭按钮的,但是在某些场景我们不需要layui的关闭按钮,这时只需添加closeBtn :0即可 效果图如下: 示例代码如下: layui.use('layer', func ...

  4. layui(弹出层)

    首先引入文件 layui.css jquery.min.js layui.js 弹出层 data-method 后面的属性控制是什么弹窗,在js中写方法 <div class="sit ...

  5. layui的弹出层的title的自定义html

       layui的弹出层的title的自定义html //在这里面输入任何合法的js语句 layer.open({ type: 1 //Page层类型 ,area: ['500px', '300px' ...

  6. layui获取弹出层内容

    一. 弹出层: <body class="childrenBody"> <form class="layui-form"> <di ...

  7. LayUI之弹出层

    1.导入插件 layui使用需要导入layui的js和css: <link rel="stylesheet" href="layui/css/layui.css&q ...

  8. 关于弹出层(iframe)时刷新页面的js

    [javascript] view plaincopyprint? iframe弹出子页面刷新父页面iframe parent.location.reload(); [javascript] view ...

  9. 在layui layer 弹出层中加载 layui table

    layui.use('table', function(){ var table = layui.table; layer.open({ type : 1, area : [ "600px& ...

随机推荐

  1. JavaSE学习笔记(9)---集合类和泛型

    JavaSE学习笔记(9)---集合类和泛型 1.Collection集合 集合概述 在前面我们已经学习过并使用过集合ArrayList<E> ,那么集合到底是什么呢? 集合:集合是jav ...

  2. Linux_Centos7安装VNC实现远程桌面

    一.首先安装GNOME桌面 yum groupinstall -y "GNOME Desktop"# 安装完成后,修改默认启动方式为图形化界面systemctl set-defau ...

  3. 剑指offer-基础练习-快速排序-排序

    /* 题目:快速排序 */ /* 思路:将一个数组分为两份,左边的数字小于index,右边的数字大于index,递归划分后形成一个排序后的数组. */ void QuickSort(int data[ ...

  4. scrapy框架综合运用 爬取天气预报 + 定时任务

    爬取目标网站: http://www.weather.com.cn/ 具体区域天气地址: http://www.weather.com.cn/weather1d/101280601.shtm(深圳) ...

  5. [PAT] A1020 Tree Traversals

    [题目] distinct 不同的 postorder 后序的 inorder 中序的 sequence 顺序:次序:系列 traversal 遍历 题目大意:给出二叉树的后序遍历和中序遍历,求层次遍 ...

  6. Codeforces Round #622 (Div. 2) C2 - Skyscrapers (hard version) 单调栈

    从左往右扫,找到比第i个小的第一个数字,l[i] = l[last] + (i - last) * m[i],用单调栈O(n)维护这个过程,再从右往左扫,同理可以算出r数组,注意一下long long ...

  7. VS打包程序步骤

    1.下载打包的程序 2.在你的程序里面安装打包的项目 3.添加项目输出 4.为项目添加必要的文件 双击前面建立好的主输出 一般文件为一些配置文件(如使用Nlog写日志,需要添加Nlog的配置文件)和图 ...

  8. elasitic search fresh flush segment merge

    new document首先在in memory buffer 中 (1)fresh 触发条件:默认one second 执行一次 执行过程:将memory buffer中documents 写入至f ...

  9. HTML连载64-a标签伪类选择器的注意点与练习

    一.a标签的伪类选择器注意点 (1)a标签的伪类选择器可以单独出现,也可以一起出现.也就是可以设置多个状态的样式. (2) a标签的伪类选择器如果一起出现,那么有严格的顺序要求,编写的顺序必须要遵守原 ...

  10. java - GC垃圾收集器详解(三)

    以前收集器的特点 年轻代和老年代是各自独立且连续的内存块 年轻代收集必须使用单个eden+S0+S1进行复制算法 老年代收集扫描整个老年代区域 都是以尽可能少而快速地执行GC为设计原则 G1是什么 G ...