如何使用导出按钮将数据表中的按钮分组?

时间:2019-07-18 11:20:50

标签: javascript jquery datatables

我有一个下拉按钮,所有导出按钮都在其下拉列表的内部和外部,另外两个按钮没有与“导出”下拉按钮分组。

buttons: [{
  extend: 'collection',
  text: 'Export',
  className: 'btn btn-sm btn-outline-dark',
  buttons: [{
    extend: 'excel',
    title: 'Re-assigned-Queries'
  }, {
    extend: 'pdf',
    title: 'Re-assigned-Queries'
  }, {
    extend: 'csv',
    title: 'Re-assigned-Queries'
  }]
}, {
  text: 'Select all',
  className: 'btn btn-sm btn-outline-blue',
  action: function() {
    reassignQueryTable.rows().select();
  }
}, {
  text: 'Select none',
  className: 'btn btn-sm btn-outline-red',
  action: function() {
    reassignQueryTable.rows().deselect();
  }
}],

导出按钮与其他两个按钮分开,另外两个按钮按组分开。 我希望将这三个按钮全部归为一个。

enter image description here

1 个答案:

答案 0 :(得分:1)

为按钮添加唯一的类

 extend: 'collection',
  text: 'Export',
  className: 'btn btn-sm btn-outline-dark no-round-right',
  buttons: [{
    extend: 'excel',
    title: 'Re-assigned-Queries'
  },

然后为她创建一个CSS

.no-round-right{
    border-radius: 50px 0px 0px 50px;
}