responsive.details.target

自：Responsive 1.0.0

當使用 column 詳細資料類型時，用於子行顯示控制的欄位/選擇器。
請注意 - 此屬性需要 DataTables 的 Responsive 擴充功能。

描述

當為 responsive.details.type 選項選擇 column 類型時，此選項可以控制表格中哪個元素將觸發每列中的顯示/隱藏控制項。它可以是欄位索引或 jQuery 選擇器，如下詳述。

如果 responsive.details.type 使用 inline 選項，則此選項無效。

請注意，與 Responsive 的所有其他設定選項一樣，此選項是 DataTables 選項預設集的延伸。此屬性應在 DataTables 初始化物件中設定。

類型

數字

描述

要將顯示/隱藏控制項附加到的欄位索引。它可以是 >=0 以從左側計算欄位，或是 <0 以從右側計算。

請注意，此處定義的欄位應新增 dtr-control 類別。這允許 Responsive CSS 向最終使用者顯示控制圖示。

字串

描述

作為字串，此選項用作 jQuery 選擇器，以確定哪些元素將觸發詳細子列的顯示/隱藏控制項。這使得可以使用表格中的任何元素 - 例如，您可以使用整列，或列中的單個 img 元素。

作為空字串，使用者通過 Responsive 預設點擊操作啟動列詳細資料的功能將被移除。

預設值

值：0

範例

使用 column 控制類型並以最右側的欄位為目標

new DataTable('#myTable', {
	responsive: {
		details: {
			type: 'column',
			target: -1
		}
	},
	columnDefs: [
		{
			className: 'dtr-control',
			orderable: false,
			targets: -1
		}
	]
});

使用整列來顯示/隱藏詳細資料列

new DataTable('#myTable', {
	responsive: {
		details: {
			type: 'column',
			target: 'tr'
		}
	}
});