ASP.NET MVC 使用 Datatables (2)

发布时间：2020-12-16 03:39:00 所属栏目：asp.Net 来源：网络整理

导读：ASP.NET MVC 使用 Datatables (2) 在服务器端实现分页，排序，获取当前页面数据在上篇的基础上进行改造(datatables的客户端实现) 1、修改View页面代码如下： 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 3

ASP.NET MVC 使用 Datatables (2)

在服务器端实现分页，排序，获取当前页面数据

在上篇的基础上进行改造(datatables的客户端实现)

1、修改View页面代码如下：

 
       < 
       div 
       ? 
       class="row"> 
      
       ???? 
       class="col-md-12"> 
      
       ???????? 
       class="panel panel-primary" id="list-panel"> 
      
???????????? 
       class="panel-heading"> 
      
???????????????? 
       h1 
       ? 
       class="panel-title">Assets</ 
       h1 
       > 
      
</ 
       div 
       > 
      
class="panel-body"> 
      
table 
       ? 
       id="assets-data-table" class="table table-striped table-bordered" style="width:100%"> 
      
        ? 
      
table 
       > 
      
> 
      
> 
      
> 
      
       > 
      
@section Scripts 
      
{ 
      
script 
       ? 
       type="text/javascript"> 
      
var assetListVM; 
      
$(document).ready(function () { 
      
assetListVM = { 
      
dt:null, 
      
init: function () { 
      
???????????????????? 
       dt = $("#assets-data-table").DataTable({ 
      
???????????????????????? 
       "serverSide": true, 
      
"proccessing": true, 
      
"ajax": { 
      
???????????????????????????? 
       "url":"@Url.Action("Get","Asset")" 
      
}, 
      
"columns": [ 
      
{ "title": "Bar Code","data": "Barcode","searchable": true }, 
      
{ "title": "Manufacturer","data": "Manufacturer", 
      
{ "title": "Model","data": "ModelNumber", 
      
{ "title": "Building","data": "Building", 
      
{ "title": "Room No","data": "RoomNo" }, 
      
{ "title": "Quantity","data": "Quantity" } 
      
], 
      
"lengthMenu": [[10,25,50,100],[10,100]], 
      
"language": { 
      
"processing": "处理中...", 
      
"lengthMenu": "显示 _MENU_ 项结果", 
      
"zeroRecords": "没有匹配结果", 
      
"info": "显示第 _START_ 至 _END_ 项结果，共 _TOTAL_ 项", 
      
"infoEmpty": "显示第 0 至 0 项结果，共 0 项", 
      
"infoFiltered": "(由 _MAX_ 项结果过滤)", 
      
"infoPostFix": "", 
      
"search": "搜索:", 
      
"searchPlaceholder": "搜索...", 
      
"url": "", 
      
"emptyTable": "表中数据为空", 
      
"loadingRecords": "载入中...", 
      
"infoThousands": ",", 
      
"paginate": { 
      
???????????????????????????????? 
       "first": "首页", 
      
"previous": "上页", 
      
"next": "下页", 
      
"last": "末页" 
      
"aria": { 
      
paginate: { 
      
???????????????????????????????????? 
       first: ‘首页‘, 
      
previous: ‘上页‘, 
      
next: ‘下页‘, 
      
last: ‘末页‘ 
      
"sortAscending": ": 以升序排列此列", 
      
"sortDescending": ": 以降序排列此列" 
      
"decimal": "-", 
      
"thousands": "," 
      
} 
      
}); 
      
} 
      
}; 
      
assetListVM.init(); 
      
}); 
      
script 
       > 
      
}

2、添加服务端必须的组件：

　　A:Install-Package datatables.mvc5

　　B:Install-Package System.Linq.Dynamic　　

3、添加服务器端方法：

 
  
 
      
       public 
       ? 
       ActionResult Get([ModelBinder( 
       typeof 
       (DataTablesBinder))] IDataTablesRequest requestModel) 
      
 
       ???????? 
       { 
      
 
       ???????????? 
       IQueryable<Asset> query = dbContext.Assets; 
      
???????????? 
       var 
       ? 
       totalcount = query.Count(); 
      

        ? 
      
???????????? 
       #region Filtering 
      
if 
       ? 
       (requestModel.Search.Value!= 
       string 
       .Empty) 
      
{ 
      
???????????????? 
       value = requestModel.Search.Value.Trim(); 
      
???????????????? 
       query = query.Where(p => p.Barcode.Contains(value) || 
      
????????????????????????????????????????? 
       p.Manufacturer.Contains(value) || 
      
p.ModelNumber.Contains(value) || 
      
p.Building.Contains(value) 
      
???????????????????????????????????? 
       ); 
      
} 
      

        ? 
      
filteredCount = query.Count(); 
      
#endregion 
      

        ? 
      
#region Sorting 
      
sortedColumns = requestModel.Columns.GetSortedColumns(); 
      
orderByString =? 
       .Empty; 
      
foreach 
       ? 
       ( 
       column? 
       in 
       ? 
       sortedColumns) 
      
{ 
      
orderByString += orderByString !=? 
       .Empty ?? 
       "," 
       ? 
       :? 
       "" 
       ; 
      
orderByString += (column.Data) + (column.SortDirection == Column.OrderDirection.Ascendant? 
       " asc" 
       : 
       " desc" 
       ); 
      
} 
      

        ? 
      
query = query.OrderBy(orderByString ==? 
       " Barcode asc" 
       ? 
       : orderByString); 
      

        ? 
      

        ? 
      
#endregion 
      
???????????? 
       //Paging 
      
query = query.Skip(requestModel.Start).Take(requestModel.Length); 
      

        ? 
      
data = query.Select(asset=> 
       new 
      
{ 
      
????????????????? 
       AssetID=asset.AssetID, 
      
Barcode=asset.Barcode,238);">Manufacturer=asset.Manufacturer,238);">ModelNumber=asset.ModelNumber,238);">Building=asset.Building,238);">RoomNo=asset.RoomNo,238);">Quantity=asset.Quantity 
      
}).ToList(); 
      

        ? 
      
return 
       ? 
       Json( 
       new 
       ? 
       DataTablesResponse(requestModel.Draw,data,filteredCount,totalcount),JsonRequestBehavior.AllowGet); 
      
} 
      
 
    

4、运行程序，查看结果

来源：?https://www.cnblogs.com/mikechang/p/5814138.html

来自为知笔记(Wiz)

（编辑：李大同）

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