layui表格遇到的小操作

• 表头文字显示不全

done:function(res){
    tdTitle()
},


/*表头文字显示不全*/
function tdTitle(){
    $('th').each(function(index,element){
        $(element).attr('title',$(element).text());
    });
    $('td').each(function(index,element){
        $(element).attr('title',$(element).text());
    });
};

View Code

• 表格内时间戳转换为标准时间

{field: 'date', title: '注册时间', templet : "<div>{{layui.util.toDateString(d.ordertime, 'yyyy年MM月dd日 HH:mm:ss')}}</div>"}

• 表格中对应的返回值改变对应文字

//1.
{ field: 'permission', title: '来源',
    templet: function (d) {
        switch (d.permission) {
            case 0:
                return '普通用户';
                break;
            case 1:
                return '馆长';
                break;
            case 2:
                return '馆员';
                break;
            case 3:
                return '馆配商';
                break;
            }
        }
    },
//2.
done: function(res, curr, count){
     $("[data-field='permission']").children().each(function(){
         if($(this).text()=='0'){
             $(this).text("普通用户")
         }else if($(this).text()=='1'){
             $(this).text("馆长")
         }else if($(this).text()=='2'){
             $(this).text("馆员")
         }else if($(this).text()=='3'){
             $(this).text("馆配商")
         }
});

View Code

• 表格中根据返回值显示操作按钮

{{# if(d.IsAudit==false){ }}
<a class='layui-btn layui-btn-xs layui-btn-normal' lay-event='edit'>编辑</a>
 {{#  } else { }}
<a class='layui-btn layui-btn-xs layui-btn-danger' lay-event='audit'>审核</a>
{{# } }}

View Code

• 表头居中

.layui-table-view .layui-table td, .layui-table-view .layui-table th{text-align:center;}

• 表格高度自适应

.layui-table-cell{height:auto !important;}

 

转载于:https://www.cnblogs.com/M-miao/p/11319804.html