【发布时间】:2020-01-11 18:16:35
【问题描述】:
给出下表描述:
<script>
var customMutator = function(value, data, type, params, component){
return data.category_name + " " + data.short_description;
} ;
var tabledata = [
{id:1, category_name:"IT", short_description:"This is an IT message", long_description:"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.", valid_from:"2019-12-05T10:48:00", valid_to:"2018-12-04T22:00:00"},
{id:2, category_name:"Bookeeping", short_description:"This is an bookeeping message", long_description:"Lorem ipsum dolor azaz sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.", valid_from:"2019-12-04T10:48:00", valid_to:"2019-12-04T22:00:00"},
];
var printIcon = function(cell, formatterParams, onRendered){
return '<span style="color:blue;"><i class="far fa-edit"></i></span>';
};
var table = new Tabulator("#mb-table", {
placeholder:"Keine Nachricht vorhanden...",
height: window.innerHeight - 53,
layout:"fitColumns",
langs:{
"de-de":{
"headerFilters":{
"default":"Filtern..."
}
}
},
columns:[
{title:"Kategorie", field:"category_name", headerFilter:true, width:120},
{title:"Kat", field:"new_kat", mutator:customMutator, headerFilter:true, width:120},
{title:"Nachricht", field:"short_description", headerFilter:true, formatter:function(cell, formatterParams){
var val1 = cell.getValue();
var val2 = cell.getRow().getData().long_description;
cell.getElement().style.whiteSpace = "pre-wrap";
return "<span style='font-weight:bold;'>" + val1 + "</span><br><span style='word-break: normal;'>" + val2 + "</<span>";
}
},
{title:"Gültig von", field:"valid_from", headerFilter:true, width:110, sorter:"datetime", sorterParams:{format:"YYYY-MM-DDThh:mm:ss"},
formatter:"datetime", formatterParams:{
inputFormat:"YYYY-MM-DDThh:mm:ss",
outputFormat:"DD.MM.YYYY hh:mm"
},
},
{title:"Gültig bis", field:"valid_to", headerFilter:true, width:110, sorter:"datetime", sorterParams:{format:"YYYY-MM-DDThh:mm:ss"},
formatter:"datetime", formatterParams:{
inputFormat:"YYYY-MM-DDThh:mm:ss",
outputFormat:"DD.MM.YYYY hh:mm"
},
},
{formatter:printIcon, align:"center", width:10, headerSort:false,
cellClick:function(e, cell){alert("Printing row data for: " + cell.getRow().getData().id)}},
{formatter:"buttonCross", width:10, align:"center", headerSort:false,
cellClick:function(e, cell){alert("Printing row data for: " + cell.getRow().getData().category_name)}},
]
});
table.setLocale("de-de");
table.setData(tabledata);
</script>
我没有看到 Kat 列中显示任何内容。 我做错了什么?
编辑: 实际上,甚至没有调用 mutator 函数。 如果我放置 console.log(data); (当然是在返回之前)进入函数我在控制台中看不到任何东西
【问题讨论】:
标签: tabulator