asp.net mvc bootstrap datatable 服务端分页

datatable 服务端分页

因项目需求变动，需处理大量数据，更改成服务端分页，自己两天的学习笔记

先上图【 jqueryui风格】

前端代码：

@{
Layout = null;
}

<!DOCTYPE html>

</div>
</div>

$(function () {
var table;

table = $('#archivestable').dataTable({
"bJQueryUI": true, //是否使用 jQury的UI theme
"language": {
"sProcessing": "处理中...",
"sLengthMenu": "每页显示 _MENU_ 项",
"sZeroRecords": "没有匹配结果",
"sInfo": "显示第 _START_ 至 _END_ 项，共 _TOTAL_ 项",
"sInfoEmpty": "显示第 0 至 0 项，共 0 项",
"sInfoFiltered": "(由 _MAX_ 项过滤)",
"sInfoPostFix": "",
"sSearch": "搜索:",
"sUrl": "",
"sEmptyTable": "表中数据为空",
"sLoadingRecords": "正在拼命加载...",
"sInfoThousands": ",",
"oPaginate": {
"sFirst": "首页",
"sPrevious": "上页",
"sNext": "下页",
"sLast": "末页"
},
"oAria": {
"sSortAscending": ": 以升序排列此列",
"sSortDescending": ": 以降序排列此列"
},
"deferRender": true
},
"bRetrieve": "true",
"responsive": "true",
"paging": "true",
"bServerSide": true, //:服务端处理分页后数据,客户端呈现,此时为true.但此时aoColumns要变,将'sName'换成mDataProp,同时自定义列也要有对应的数据
//"sServerMethod": "GET",//老版本提交方式
//"sAjaxSource": "/Home/GetNesList", //ajax Url地址
"ajax": {
"url": "/Home/GetNesList",
"type": "POST"
},
"bProcessing": true,

"bPaginate": true,
"sPaginationType": "full_numbers",

'bFilter': false,//关闭搜索
'bsearch': false,

"aLengthMenu": [6, 8, 10, 20, 50],
"iDisplayLength": 8,
"iDisplayStart": 0,
'bAutoWidth': true,
"aoColumns": [
{ "data": "Id" },
{ "data": "Title" },
{ "data": "NewsContent" },

{ "data": "DCount" },
{ "data": "Status" },
{ "data": null },
],

"aoColumnDefs": [
{
"targets": [4],
"searchable": false,
"render": function (data, type, row) {
if (data == 0)
return '禁用';
else
return '可用';
}
}, {

sDefaultContent: '',
aTargets: ['_all']
}
]
});

////表格行点击设置选中样式
$("#archivestable tbody").on("click", "tr", function () {
var $curr = $(this);
if ($curr.hasClass("selected")) {
$curr.removeClass("selected");
}
else {
table.$("tr.selected").removeClass("selected");
$curr.addClass("selected");
}
});

});

</script>
</body>
</html>

后端：实体类

/// <summary>
/// 临时新闻类
/// </summary>
public class News
{
public int Id { get; set; }
public string Title { get; set; }
public string NewsContent { get; set; }

public int DCount { get; set; }
public int Status { get; set; }

}

/// <summary>
///分页类处理

/// </summary>
public class DataTableParameter
{
/// <summary>
/// 1.0 DataTable用来生成的信息
/// </summary>
public string sEcho { get; set; }

/// <summary>
/// 2.0分页起始索引
/// </summary>
public int Start { get; set; }

/// <summary>
/// 3.0每页显示的数量
/// </summary>
public int Length { get; set; }

/// <summary>
/// 4.0搜索字段
/// </summary>
public string search { get; set; }

/// <summary>
/// 5.0列数
/// </summary>
public int iColumns { get; set; }

/// <summary>
/// 6.0排序列的数量
/// </summary>
public int iSortingCols { get; set; }

/// <summary>
/// 7.0逗号分割所有的列
/// </summary>
public string sColumns { get; set; }
}

数据源：

/// <summary>
/// 生成数据源
/// </summary>
/// <returns></returns>
public List<News> Getlist()
{
List<News> myLsit = new List<News>();
for (int i = 0; i < 300; i++)
{
if (i % 2 == 0)
{
myLsit.Add(new News { Id = i, Title = "ceshi", NewsContent = "哈哈" + i, DCount = 20, Status = 0 });
}
else
{
myLsit.Add(new News { Id = i, Title = "ceshi", NewsContent = "哈哈" + i, DCount = 20, Status = 1 });
}

}
return myLsit;
}

//控制器代码

public JsonResult GetNesList(DataTableParameter tp)
{
#region

//1 获取数据源
List<News> DataSource = Getlist();
//DataSource = DataSource.OrderByDescending(a => a.SubTime).ToList();

//2 处理页数
string echo = tp.sEcho; //用于客户端自己的校验
int dataStart = tp.Start;//开始页数
int pageSize = tp.Length == -1 ? DataSource.Count : tp.Length;//总页数
string search = tp.search;

//3 是否有搜索框条件，【因为版本问题，暂时没有实现】

if (!String.IsNullOrEmpty(search))
{
var data = DataSource.Where(a => a.Title.Contains(search) ||
a.NewsContent.Contains(search))
.Skip<News>(dataStart)
.Take(pageSize)
.ToList();

return Json(new
{
sEcho = echo,
iTotalRecords = DataSource.Count(),
iTotalDisplayRecords = DataSource.Count(),
aaData = data
}, JsonRequestBehavior.AllowGet);
}
else
{
var data = DataSource.Skip<News>(dataStart)
.Take(pageSize)
.ToList();

return Json(new
{
sEcho = echo,
iTotalRecords = DataSource.Count(),
iTotalDisplayRecords = DataSource.Count(),
aaData = data
}, JsonRequestBehavior.AllowGet);
}
#endregion
}

第一次写，代码很糟糕

每一份坚持，以后都会有收获