layui中弹出层出现数据表格

layui中的弹出层出现数据表格

function popup(result) {
            layui.use('table', function () {

                var table = layui.table;
                layer.open({
                    type: 1,
                    area: ["700px", '430px'],
                    title: "选择",
                    maxmin: false,
                    content: '<div><table id="templateTable" lay-filter="templateTable"></table></div>', //先定义一个数据表格的div框
                    success: function (index, layero) {
                        table.render({
                            elem: '#templateTable'
                            , height: 300
                            , width: '100%'
                            , data: result //result格式为[{},{}],此处用的是固定数据,也可以用url来请求后台获取数据,如果使用url要根据layui规定的格式返回才可以渲染上,例:{"code": 0,"msg": "","count": 1000,"data": [{}, {}]} 或者使用parseData进行转化也可以
                            , cols: [[ //设置数据表格表头
                                {checkbox: true} //开启复选框
                                ,{field: 'path', title: '文件名称', width: 700, hide: true}
                                ,{field:'qad1', width: 165, title: 'QAD号'}
                                ,{field:'sid', width: 165, title: 'yst',hide: true}
                                ,{field:'describe1', width: 165, title: '物料描述1'}
                                ,{field:'describe2', width: 165, title: '物料描述2'}
                                ,{field:'company', width: 165, title: '设计单位'}
                                ,{field:'qad2', width: 165, title: 'QAD号'}
                                ,{field:'describe3', width: 165, title: '物料描述1'}
                                ,{field:'describe4', width: 165, title: '物料描述2'}
                                ,{field:'partNumber', width: 165, title: '零件号'}
                                ,{field:'company2', width: 165, title: '设计单位'}
                                ,{field:'place', width: 165, title: '地点'}
                                ,{field:'reference', width: 165, title: '参考号'}
                                ,{field:'workingNum', width: 165, title: '工序号'}
                                ,{field:'purchaseStock', width: 165, title: '采购地点/制造地点'}
                                ,{field:'supplierName', width: 165, title: '供应商名称'}
                            ]]
                            , page: true //使用分页
                            , limits: [10, 20, 30, 40, 50, 60, 70, 80, 90, 100] //动态设置每页显示数据的条数
                            , limit: 10 //默认每页多少条
                        });
                        table.on('checkbox(templateTable)', function (obj) { //监听复选框,获取选择到的值
                             obj_data = obj.data; //获取到选中复选框上的一行数据
                            let path=obj_data.path; //获取某个字段的值

                            console.log(path);

                        })
                    },
                    btn: ['确定', '关闭'],
                    yes: function (index, layero) {
                        $.post("/sBom/save", {sid: obj_data.sid,qad1: obj_data.qad1,describe1:obj_data.describe1,describe2:obj_data.describe2,company:obj_data.company,
                            company2:obj_data.company2,describe3:obj_data.describe3,describe4:obj_data.describe4,partNumber:obj_data.partNumber,place:obj_data.place,purchaseStock:obj_data.purchaseStock,
                            qad2:obj_data.qad2,reference:obj_data.reference,supplierName:obj_data.supplierName,workingNum:obj_data.workingNum},function (obj) {
                            if (obj.code==200){
                                tableIns.reload();//重载表格
                            }
                            layer.msg(obj.msg);

                        })
                        layer.close(layer.index); //点击确定之后执行yes函数,关闭弹出层

                    }
                });
            });

        }
  • 0
    点赞
  • 11
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值