• LayUI中弹出层select动态回显设置及子页面刷新父页面Table数据方法


    var index = layer.open({
    type: 2,
    title:'修改信息',
    content: 'URL',
    area: ['1000px', '600px'],
    btn: ['确定', '取消'],
    id: 21,
    success: function (layero, index) {
    var body = layer.getChildFrame('body', index); //获取弹出层 body对象
    body.find('ID或CLASS').val(值); //通过查找Class给对象赋值
    body.find("option[value="+banner_id+"]").attr("selected",true); //通过查找原始的select中的 option给对象属性赋值
            var select = 'dd[lay-value=' + banner_id + ']'; //准备LayUI中自动生成的 dd参数  
    body.find('.banner_id').siblings("div.layui-form-select").find('dl').find(select).click(); //通过查询到指定dd,给dd触发click()点击事件

    // layui.form.render(); 刷新弹出层

    }, yes: function (index, layero) { //按确定调用弹出层点击事件 ID = #layuiadmin-app-form-submit
    var body = layer.getChildFrame('body', index);
    var submit = body.find('#layuiadmin-app-form-submit'); //获取弹出层对象,然后用对象触发弹出层的JQ点击事件 click()
    submit.click();
    }
    });


    //=================================父及页面代码==================================
    layui.use(['table'], function () {
    var table = layui.table;

    table.render({
    elem: '#tableShow'
    , url: 'http://gdhzplay.cn、XXXXXX' 2类弹层地址
    , toolbar: "#topBar"
    , totalRow: true
    ,id:'acticles_table' //子页面刷新父页面table数据要用到此ID
    , page: {
    // first:"首页"
    // ,last:"页尾"
    prev: "上一页"
    , next: "下一页"
    , limit: 5
    , layout: ['count', 'first', 'prev', 'page', 'next', 'skip'] //自定义分页布局

    }
    , cols: [[
    {type:'numbers'}
    , {field: 'id', title: 'ID', align: 'center', 60, hide: true}
    , {field: 'cid', title: 'CID', align: 'center', 60, hide: true}
    , {field: 'title', title: '文章标题', align: 'center'}
    , {field: 'author', title: '文章作者', align: 'center'}
    , {field: 'synopsis', title: '文章简介', align: 'center'}
    , {field: 'visit', title: '浏览次数', align: 'center'}
    , {
    field: 'status', title: '发布状态', align: 'center', templet: function (d) {
    return d.status == 0 ? '<span class=" layui-badge layui-bg-blue">已发布</span>' : '<span class=" layui-badge layui-bg-green">未发布</span>';
    }
    }
    , {field: 'right', title: '操作', align: 'center', toolbar: '#toolBar'}
    ]]
    , parseData: function (res) { //将原始数据解析成 table 组件所规定的数据
    // console.log(res.counts);
    return {
    "code": 0, //解析接口状态
    "msg": "", //解析提示文本
    "count": res.counts, //解析数据长度
    "data": res.data //解析数据列表
    };
    }
    , defaultToolbar: ['print', 'exports']
    });

    //===================================子页面代码============================================

    <script>

    //监听点击提交事件
    $('#layuiadmin-app-form-submit').on('click', function (index) {

    layer.msg('处理中,请稍后', {icon: 1, time: 2000}, function () {
    var index = parent.layer.getFrameIndex(window.name);
    $.ajax({
    type: "POST",
    url: "http://gdhzplay.cn/XXXXXXXX", //后台地址
    dataType: 'json',
    data:$('#dataFrm').serialize() ,
    success: function (date) {
    console.log(date);
    layer.msg('添加成功!', {icon: 6, time: 2000});

    // window.parent.location.reload();//刷新父页面
    window.parent.layui.table.reload('acticles_table'); //此处为父及页面设置的ID参数
    parent.layer.close(index);//关闭弹出层
    },errorCallback(data) {
    layer.msg('添加失败!', {icon: 5, time: 2000});
    layer.close();
    }
    });
    });

    return false;
    });

    </script>
     
  • 相关阅读:
    mysql 安装
    flying-saucer-pdf使用中字符串过长换行出问题的解决办法
    杂想
    关于MATLAB实验结果求交点问题
    关于学习方向问题
    关于读取文件夹中的图片问题
    关于ROC曲线的碎碎念
    win7(64)+vs2013+opencv3.0配置的辛酸路程
    验证模式和辨识模式
    指纹识别认证
  • 原文地址:https://www.cnblogs.com/2019gdiceboy/p/12405887.html
Copyright © 2020-2023  润新知