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'
]
}
]
});