layui中table列表 增加属性 edit="date",不生效怎么办?

如果你想在 layui 的 table 列表中增加 edit=date 属性但不生效,可能是以下问题导致的: 1. 缺少日期组件的初始化 如果想在表格中使用日期组件,需要在页面中引入 layui 的日期组件,并初始化: script type="text/javascript" src="/layui/layui.js"/scriptscript t

如果你想在 layui 的 table 列表中增加 edit="date" 属性但不生效,可能是以下问题导致的:

1. 缺少日期组件的初始化

如果想在表格中使用日期组件,需要在页面中引入 layui 的日期组件,并初始化:

<script type="text/javascript" src="/layui/layui.js"></script>
<script type="text/javascript">
    layui.use(['form', 'layer', 'laydate'], function () {
        var form = layui.form;
        var layer = layui.layer;
        var laydate = layui.laydate;
        laydate.render({
            elem: '#date' //指定元素
        });
    });
</script>

其中 #date 是指定的日期输入框的元素ID。

2. table 列表的具体实现方式有误

在使用 table 列表时,需要配置具体的数据,如:
 

table.render({
    elem: '#test',
    url: '/demo/table/user/',
    cols: [[
        {field: 'id', width:80, title: 'ID', sort: true},
        {field: 'username', width:120, title: '用户名'},
        {field: 'email', width:150, title: '邮箱'},
        {field: 'joinTime', width:160, title: '加入时间', sort: true},
        {field: 'edit', width:240, title: '操作', toolbar: '#barDemo', edit: 'date'}
    ]]
});

注意 edit: 'date' 属性的使用方式,需要放在 toolbar 后面。

如果以上步骤还不能解决问题,可能需要对代码进行调试,查看是否有报错信息或者其他问题。

本文标题为:layui中table列表 增加属性 edit="date",不生效怎么办?

基础教程推荐