数据表中的按钮和分页显示不正确

我正在使用数据表来显示报告和记录。 但我遇到的问题是文件导出按钮和底部的分页只显示为链接而不是按钮。

这是我的屏幕截图

在此处输入图像描述

这是我在页面中加载的内容

            

注意,我只想使用带引导样式的数据表。

这是我用来设置数据表的代码。

  $('#reportTable').DataTable({ dom: 'Bfrtip', buttons: [ 'copy', 'csv', 'excel', 'pdf', 'print' ], columns: [ { data: 'Category', title: 'Category' }, { data: 'Svp', title: 'SVP' }, { data: 'Rvp', title: 'RVP' }, { data: 'Division', title: 'Division' }, { data: 'ContactType', title: 'Contact Type' }, { data: 'TotalRecords', title: 'Total Records' }, ] }); 

我在这里想念的是什么? 我该如何解决这个问题

更新

我修复了导出按钮,但包括以下文件

 Vendor/datatables/v1.10.12/extensions/Buttons/js/buttons.bootstrap.min.js 

现在唯一开放的问题是底部的页面

您缺少dataTables.bootstrap.min.js脚本文件包含。 如果您从官方DataTables 下载页面下载这些文件,并且可以将其他文件的文件路径外推到此文件路径,我会看看它是否存在于此处:

 Vendor/datatables/v1.10.12/js/dataTables.boostrap.min.js 

如果不是,您可能必须返回下载页面并确保获得此脚本文件。