加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > Linux > 正文

ABP进阶教程6 - 功能按钮

发布时间:2020-12-14 00:16:18 所属栏目:Linux 来源:网络整理
导读:点这里进入ABP进阶教程目录? 下载插件 打开Datatables官网(https://datatables.net/download/) 勾选Extensions/Buttons,下载插件,复制到JD.CRS.Web.MvcwwwrootlibdataTables目录. ? 引入插件 打开展示层(即JD.CRS.Web.Mvc)的Views/Course/Index.cshtml

点这里进入ABP进阶教程目录?

下载插件

打开Datatables官网(https://datatables.net/download/)

勾选Extensions/Buttons,下载插件,复制到JD.CRS.Web.MvcwwwrootlibdataTables目录.

?

引入插件

打开展示层(即JD.CRS.Web.Mvc)的Views/Course/Index.cshtml //Course查询视图

添加以下代码,引入插件.

<link href="~/lib/dataTables/DataTables/css/jquery.dataTables.css" rel="stylesheet" asp-append-version="true" />
<link href="~/lib/dataTables/Buttons/css/buttons.dataTables.css" rel="stylesheet" asp-append-version="true" />
<script src="~/lib/dataTables/DataTables/js/jquery.dataTables.js" asp-append-version="true"></script>
<script src="~/lib/dataTables/Buttons/js/dataTables.buttons.js" asp-append-version="true"></script>
<script src="~/lib/dataTables/Buttons/js/buttons.flash.js" asp-append-version="true"></script>
<script src="~/lib/dataTables/Buttons/js/buttons.html5.js" asp-append-version="true"></script>
<script src="~/lib/dataTables/Buttons/js/buttons.print.js" asp-append-version="true"></script>
<script src="~/lib/dataTables/JSZip/jszip.js" asp-append-version="true"></script>
<script src="~/lib/dataTables/pdfmake/pdfmake.js" asp-append-version="true"></script>
<script src="~/lib/dataTables/pdfmake/vfs_fonts.js" asp-append-version="true"></script>

更新配置

打开展示层(即JD.CRS.Web.Mvc)的wwwrootview-resourcesViewsCourseIndex.js //用以存放Course查询相关脚本

自带按钮有五个:

Copy //复制到剪贴板
CSV //导出CSV
Excel //导出Excel
PDF //导出PDF
Print //打印

基础绑定

采用默认格式

?

//Button
buttons:
[ 
‘copy‘,//复制到剪贴板
‘csv‘,//导出CSV
‘excel‘,//导出Excel
‘pdf‘,//导出PDF
‘print‘ //打印
],

定制绑定

采用自定义格式

buttons:
[
    {
        extend: ‘copy‘,text: ‘复制‘ //可以中文
    },{
        extend: ‘csv‘,text: ‘CSV‘ //可以英文
    },{
        extend: ‘excel‘,text: ‘Excel‘
    },{
        extend: ‘pdf‘,text: ‘PDF‘
    },{
        extend: ‘print‘,text: ‘<i class="material-icons">print</i>‘ //可以图标
    }
],

预览效果

基础绑定

?

?定制绑定

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读