下载插件
打开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();
} );
预览效果
基本的分页/排序就出来了.