{hero}

buttons.buttons.split

自:Buttons 2.0.0 起

分割下拉式按鈕。
請注意 - 此屬性需要 DataTables 的 Buttons 擴充功能。

描述

此屬性是功能屬性 buttons.buttons.split 的別名,可用於從頂層 DataTables 設定物件設定功能,而不是在 layout 選項中設定(請參閱以下範例)。這讓您可以將功能作為字串使用,而不是物件,但如果您使用此功能的多個實例,則會限制設定。請參閱 buttons.buttons.split 的文件,以了解適用於此選項的完整詳細資訊和選項。

如果您使用的是 DataTables 1.x,該版本沒有 layout 選項,請使用此屬性名稱,但請參閱 buttons.buttons.split 的文件,以了解完整詳細資訊。

範例

用於列印選項的分割下拉式按鈕

new DataTable('#myTable', {
	layout: {
		topStart: 'buttons'
	},
	buttons: [
		{
			extend: 'csv',
			split: ['pdf', 'excel']
		}
	]
});

具有自訂按鈕的分割下拉式按鈕

new DataTable('#myTable', {
	layout: {
		topStart: 'buttons'
	},
	buttons: [
		{
			text: 'High priority',
			action: function () {
				/* ... */
			},
			split: [
				{
					text: 'Medium priority',
					action: function () {
						/* ... */
					}
				},
				{
					text: 'Low priority',
					action: function () {
						/* ... */
					}
				}
			]
		}
	]
});

具有自訂按鈕和內建按鈕混合的分割下拉式按鈕

new DataTable('#myTable', {
	layout: {
		topStart: 'buttons'
	},
	buttons: [
		{
			text: 'High priority',
			action: function () {
				/* ... */
			},
			split: [
				'pdf',
				{
					text: 'Medium priority',
					action: function () {
						/* ... */
					}
				},
				{
					text: 'Low priority',
					action: function () {
						/* ... */
					}
				}
			]
		}
	]
});

彈出視窗內的自訂 HTML

new DataTable('#myTable', {
	layout: {
		topStart: 'buttons'
	},
	buttons: [
		{
			extend: 'collection',
			className: 'custom-html-collection',
			buttons: [
				'<h3>Export</h3>',
				'pdf',
				'csv',
				'excel',
				'<h3 class="not-top-heading">Column Visibility</h3>',
				'colvis'
			]
		}
	]
});