问题描述
我的目标是在ASP Net Core中执行以下操作:
我的问题
YouTube上是否有任何教程,或任何描述该操作方法的文章?
我正在按照本教程https://youtube.com/watch?v=Pt7O-X9vmjw进行操作,问题是,尽管我能够使用他的教程创建数据表,但仍然存在以下问题:
数据表中的条目数丢失。
用户无法以excel,csv,pdf格式导出数据集并复制结果
我已经尝试了数周了。我怀疑是已经在布局中安装的引导程序导致了这些问题。任何帮助将不胜感激。
此致
桑德拉
解决方法
要达到将DataTables与data export functionality结合使用的要求,可以参考以下示例。
在_Layout.cshtml
中CSS参考
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.min.css" />
<link href="https://cdn.datatables.net/1.10.21/css/jquery.dataTables.min.css" rel="stylesheet" />
<link href="https://cdn.datatables.net/buttons/1.6.2/css/buttons.dataTables.min.css" rel="stylesheet" />
<link rel="stylesheet" href="~/css/site.css" />
JS参考
<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="~/js/site.js" asp-append-version="true"></script>
<script src="https://cdn.datatables.net/1.10.21/js/jquery.dataTables.min.js"></script>
在“查看”页面
添加数据导出插件所需的JS参考
@section scripts{
<script src="https://cdn.datatables.net/buttons/1.6.2/js/dataTables.buttons.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.2/js/buttons.flash.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.2/js/buttons.html5.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.6.2/js/buttons.print.min.js"></script>
<script>
$(function () {
$("#myTable").dataTable({
dom: 'Bfrtip',buttons: [
'copy','csv','excel','pdf','print'
]
});
})
</script>
}
测试结果