ABP进阶教程4 - 分页排序
下载插件
打开Datatables官网(https://datatables.net/download/)
下载插件,复制到JD.CRS.Web.Mvc\wwwroot\lib\dataTables目录.
这两个主文件必选,其他的看着选吧.
jquery.dataTables.js
jquery.dataTables.css
引入插件
打开展示层(即JD.CRS.Web.Mvc)的Views/Course/Index.cshtml //Course查询视图
添加两行代码,引入插件.
<link href="~/lib/dataTables/DataTables/css/jquery.dataTables.css" rel="stylesheet" asp-append-version="true" /> <script src="~/lib/dataTables/DataTables/js/jquery.dataTables.js" asp-append-version="true"></script>
更新视图
打开展示层(即JD.CRS.Web.Mvc)的Views/Course/Index.cshtml //Course查询视图
把要用到插件的<table>加上ID
<table id="dataTable" class="table">
更新脚本
打开展示层(即JD.CRS.Web.Mvc)的\wwwroot\view-resources\Views\Course\Index.js //用以存放Course查询相关脚本
绑定插件
$(document).ready( function () { $('#dataTable').DataTable(); } );
预览效果
基本的分页/排序就出来了.
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步