欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

layui在table表格中添加时间控件

程序员文章站 2022-04-08 09:33:54
...

 timeB为name

   layui.table.render({
                elem: '#lay-purchasing-change',
                     id: "layTableId1"   ,
                url: baseURL + 'purchase/erpPruchasingOver/info/' + data.purchasingOverId,
                method: 'POST'
                , where: {}
                , contentType: "application/json;charset=utf-8"
                //数据接口 //数据接口/info/{purchasingOrderId}
                , cols: [[ //表头
                    // {type:'checkbox'}
                    {field: 'timeA', title: '付款时间', align: 'center', width: 260},
                    {field: 'moneyA', title: '付款金额(元)', align: 'center', width: 260},
                    {field: 'timeB', title: '待修改时间', align: 'center', width: 260, edit: 'select',
                        templet: function (d) {
                            return '<input type="text" name="timeB" verify lay-verify="verify" value="' + (d.timeB || '') + '" placeholder="请选择时间" readonly="readonly" class="layui-input layui-input-date" style="text-align: center"/>';
                        }},
                    {field: 'moneyB', title: '待修改金额(元)', align: 'center', width: 260 ,edit: 'text'},
                ]],
                done: function (res, curr, count) {
                    //日期控件
                    $(".layui-input-date").each(function (i) {
                        layui.laydate.render({
                            elem: this,
                            format: "yyyy-MM-dd",
                            done: function (value, date) {
                                if (res && res.data[i]) {
                                    $.extend(res.data[i], {'timeB': value})
                                }
                            }
                        });
                    });
                    console.log(res);
                },
                page: false,
                loading: true
            });

 

相关标签: layui