SearchPanes 渲染
SearchPanes 允許與 DataTables 已提供的渲染函式完全整合 (columns.render
)。使用渲染器的主要優勢在於,您可以在不修改原始資料的情況下修改輸出。有關製作您自己的渲染函式的詳細資訊,可以在這裡找到。SearchPanes 在某些情況下也會使用正交資料,其詳細資訊可以在這裡找到。
SearchPanes 的基本渲染
考慮以下常見的渲染函式
{
data: "salary",
render: $.fn.dataTable.render.number( ',', '.', 0, '$' )
}
在這裡,我們正在渲染薪資欄中每個儲存格的原始資料,使其更具可讀性,並以易於理解的格式呈現。在這種情況下,SearchPanes 將以與 DataTable 相同的格式顯示資料,自動偵測渲染函式。當搜尋表格時,搜尋將在表格的原始資料上執行。
當定義一個自訂的渲染函式(如下所示)時
{
data: "salary",
render: function(data, type, row){
if(row.salary <= 200000){
return "Low";
}
else if (row.salary <=800000){
return "Medium";
}
else if (row.salary > 800000){
return "High";
}
else {
return "Other";
}
}
}
渲染函式將再次以與 DataTable 相同的方式顯示資料。但是現在它將根據這些選項進行篩選。
SearchPanes 的陣列渲染
考慮以下渲染函式
{
data: "permission",
render: {
_: '[, ].name',
sp:'[].name'
},
searchPanes: {
orthogonal:'sp'
}
}
在這裡,陣列格式的原始資料將以 string
顯示,並在 DataTable 中使用 ', '
分隔符。SearchPane 中陣列中的每個不同元素都將被賦予一個選項。當搜尋這些選項時,將顯示原始陣列中包含該選項的任何列。