columns.responsivePriority
自:Responsive 2.0.0
設定欄位的可見性優先順序。
請注意 - 此屬性需要 DataTables 的 Responsive 擴充功能。
描述
當表格太寬而無法在特定顯示器上呈現時,Responsive 會自動從表格的右側移除欄位。雖然這是很有用的預設值,但您可能希望控制欄位隱藏的順序。此參數透過設定可見性優先順序來提供該功能。
給定的值將設定欄位的可見性優先順序,較小的數字表示在表格中保持可見的較高優先順序。例如,無論欄位在表格中出現的順序如何,優先順序為 2 的欄位將在優先順序為 1 的欄位之前從顯示畫面中移除。
當您希望保持右側欄位的可見性,因為它們包含動作按鈕或其他重要資訊時,這會特別有用。
欄位優先順序也可以由欄位標頭儲存格上的 data-priority
屬性定義(例如,<th data-priority="1">名字</th>
)。如果為單一欄位設定了 data-priority
屬性和 columns.responsivePriority
值,則始終使用 columns.responsivePriority
值。
類型
整數
- 描述
優先順序為整數值,其中較小的數字會被賦予較高的優先順序(即優先順序為 2 的欄位將在優先順序為 1 的欄位之前隱藏)。
預期給定的優先順序應 >=0,但技術上可以使用負數來提高重要欄位的優先順序。
預設值
- 值:
undefined
此參數的預設值為 undefined
。當 Responsive 找到未定義的優先順序值時,它會自動將欄位的優先順序設定為 10000。
範例
將優先順序賦予第一個和最後一個欄位
new DataTable('#myTable', {
responsive: true,
columnDefs: [
{ responsivePriority: 1, targets: 0 },
{ responsivePriority: 2, targets: -1 }
]
});
從左到右隱藏欄位
new DataTable('#myTable', {
responsive: true,
columns: [
{ responsivePriority: 6 },
{ responsivePriority: 5 },
{ responsivePriority: 4 },
{ responsivePriority: 3 },
{ responsivePriority: 2 },
{ responsivePriority: 1 }
]
});