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;}