layui 弹窗表单提交后跳转到列表页

最新推荐文章于 2021-12-23 16:11:40 发布

顾米楠

最新推荐文章于 2021-12-23 16:11:40 发布

阅读量4.1k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： layui 文章标签： layui

本文链接：https://blog.youkuaiyun.com/qq_38350907/article/details/88794811

layui 专栏收录该内容

10 篇文章

订阅专栏

本文介绍使用layui框架进行页面操作时遇到的问题及两种解决方法。一种是通过获取并关闭弹窗索引后跳转；另一种是利用定时器实现父窗口刷新。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

荆轲刺秦王

先大概描述下遇到的问题，就是在使用 layui 做后台框架的时候，添加和编辑操作，都是用的弹窗 layer ，这样有一个问题，就是在提交完表单后，应该跳转到列表页。

先说说第一种解决方案：

q.post('{:url("edit")}?id='+id,param,function(json){
                layer.close(loading);
                if(json.status == 1){
                    layer.msg(json.msg, {icon: 1, time: 1600}, function(){
                        var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                        parent.layer.close(index); //再执行关闭 
                        top.window.location.href="{:url('course_case/index')}";
                        // window.location.href="{:url('course_case/edit')}?id="+id;
                    });
                }else{
                    layer.msg(json.msg, {icon: 2, anim: 6, time: 1600});
                }
            },'json');

大概思路就是，现获取当前弹窗的索引，然后再关闭，最后跳转。代码中的注释也很清楚。

再来说说第二种方式：

jq.post('{:url("add")}',param,function(json){
                layer.close(loading);
                if(json.status == 1){
                    layer.msg(json.msg, {icon: 1, time: 1600}, function(){
                        //window.location.href="{:url('hotel/add')}";
                        setTimeout(function(){parent.window.location.reload();},100);
                    });
                }else{
                    layer.msg(json.msg, {icon: 2, anim: 6, time: 1600});
                }
            },'json');

这种方式更为简单粗暴一点，定时器，然后父窗口刷新。