Laravel，如何更改/重新排列数据表按钮和记录条目？

vfh0ocws 于 2023-10-22 发布在其他

关注(0)|答案(1)|浏览(80)

我的目标是安排按钮和其他功能，如下图所示：

如何，

使额外的按钮，并在左上角的地方
把记录条目和搜索栏并排放在右上角
Excel和PDF在左下角
右下角分页

到目前为止，我所做的是使用dom，但结果是记录条目仍然在左上角，左上角没有额外的按钮。

dom: "lfrtpB",
pageLength: 10,
lengthMenu: [ 5, 10, 30, 50 ],
buttons: [
   {
       extend: 'pdf',
       exportOptions: {
           columns: [0,1,2,3]
       }
   },
   {
       extend: 'csv',
       exportOptions: {
           columns: [0,1,2,3]
       }
   },
   {
       extend: 'excel',
   }
],

laravel

来源：https://stackoverflow.com/questions/77252199/laravel-how-to-change-rearrange-datatable-buttons-and-records-entries

1条答案

按热度按时间

0kjbasz61#

在Laravel DataTables中，您可以使用dom选项自定义DataTable的布局。要实现您所描述的布局，可以按如下方式修改dom选项：

`
dom: 
  "<'row'<'col-md-6'l><'col-md-6'f>>" + // Custom top row with record entries and search bar
  "<'row'<'col-md-6'B><'col-md-6'>>" +  // Custom bottom row for buttons and pagination
  "<'row'<'col-md-12't>>" +             // Table body
  "<'row'<'col-md-6'i><'col-md-6'p>>",  // Information and pagination

pageLength: 10,
lengthMenu: [5, 10, 30, 50],
buttons: [
  {
    text: 'Your Extra Button', // Add your custom button text
    action: function (e, dt, node, config) {
      // Add your custom button action here
      alert('Custom button clicked!');
    }
  },
  {
    extend: 'pdf',
    exportOptions: {
      columns: [0, 1, 2, 3]
    }
  },
  {
    extend: 'csv',
    exportOptions: {
      columns: [0, 1, 2, 3]
    }
  },
  {
    extend: 'excel',
  }
]

`

赞(0）回复(0）举报 2023-10-22

我来回答

Laravel，如何更改/重新排列数据表按钮和记录条目？

1条答案

相关问题

热门标签

最新问答