.Net MVC+Data Table實現分頁+排序的執行個體教程

來源:互聯網
上載者:User
這篇文章主要介紹了ASP.Net MVC+Data Table實現分頁+排序功能的方法,結合執行個體形式分析了asp.net基於mvc架構實現的資料查詢、排序、分頁顯示等相關操作技巧,需要的朋友可以參考下

本文執行個體講述了ASP.Net MVC+Data Table實現分頁+排序功能的方法。分享給大家供大家參考,具體如下:

實現思路:

使用datatable內建的分頁,排序
使用attribute+反射來控制需要排序和顯示的欄位以及順序
分離排序和顯示邏輯
若要添加搜尋邏輯只需要傳遞搜尋的欄位到後端即可(js初始化時把"searching": false拿掉)。

View :


@using BCMS.BusinessLogic@using BCMS.BusinessLogic.Models@model List<BusCaptainObj><table id="tblData" class="table table-striped">  <thead>    <tr class="data-list">      <th style="width:10%;">@Html.DisplayNameFor(model => model.First().PersNo)</th>      <th style="width:30%;">@Html.DisplayNameFor(model => model.First().Personnel_Name)</th>      <th style="width:20%;">@Html.DisplayNameFor(model => model.First().Position)</th>      <th style="width:20%;">@Html.DisplayNameFor(model => model.First().Interchange)</th>      <th style="width:20%;">Action</th>    </tr>  </thead></table>@section scripts {  <script type="text/javascript">     @{       var columns = DataTableHelper.DisplayColumns<BusCaptainObj>();     }    $(document).ready(function () {      $('#tblData').dataTable({        "processing": true,        "serverSide": true,        "searching": false,        "stateSave": true,        "oLanguage": { "sInfoFiltered": "" },        "ajax": {          "url": @Url.Action("GetJsonData"),          "type": "GET"        },        "columns": [          { "data": "@columns[0]" },          { "data": "@columns[1]" },          { "data": "@columns[2]" },          { "data": "@columns[3]" },          {            "data": "@columns[0]",            "orderable": false,            "searchable": false,            "render": function (data, type, full, meta) {              if (type === 'display') {                return GetDetailButton("/BusCaptain/Detail?bcId=", data) + GetInfoButton("/Telematics?bcId=", data, "Performance");              } else { return data; }            }          }        ],        "order": [[0, "asc"]]      });    });  </script>}

Controller :


public ActionResult GetJsonData(int draw, int start, int length){  string search = Request.QueryString[DataTableQueryString.Searching];  string sortColumn = "";  string sortDirection = "asc";  if (Request.QueryString[DataTableQueryString.OrderingColumn] != null)  {    sortColumn = GetSortColumn(Request.QueryString[DataTableQueryString.OrderingColumn]);  }  if (Request.QueryString[DataTableQueryString.OrderingDir] != null)  {    sortDirection = Request.QueryString[DataTableQueryString.OrderingDir];  }  DataTableData dataTableData = new DataTableData();  dataTableData.draw = draw;  int recordsFiltered = 0;  dataTableData.data = BusCaptainService.Instance.SearchMyBuscaptains(User.Identity.Name, out recordsFiltered, start, length, sortColumn, sortDirection, search).Data;  dataTableData.recordsFiltered = recordsFiltered;  return Json(dataTableData, JsonRequestBehavior.AllowGet);}public string GetSortColumn(string sortColumnNo){  var name = DataTableHelper.SoringColumnName<BusCaptainObj>(sortColumnNo);  return name;}public class DataTableData{  public int draw { get; set; }  public int recordsFiltered { get; set; }  public List<BusCaptainObj> data { get; set; }}

Model :


class XXX{...  [DisplayColumn(0)]    [SortingColumn(0)]    public int? A { get; set; }    [DisplayColumn(1)]    [SortingColumn(1)]    public string B { get; set; }...}

Helper class :


public class SortingColumnAttribute : Attribute{    public int Index { get; }    public SortingColumnAttribute(int index)    {      Index = index;    }}public class DisplayColumnAttribute : Attribute{    public int Index { get; }    public DisplayColumnAttribute(int index)    {      Index = index;    }}public static class DataTableQueryString{    public static string OrderingColumn = "order[0][column]";    public static string OrderingDir = "order[0][dir]";    public static string Searching = "search[value]";}public static class DataTableHelper{    public static IList<string> DisplayColumns<T>()    {      var result = new Dictionary<int, string>();      var props = typeof(T).GetProperties();      foreach (var propertyInfo in props)      {        var propAttr =          propertyInfo            .GetCustomAttributes(false)            .OfType<DisplayColumnAttribute>()            .FirstOrDefault();        if (propAttr != null)        {          result.Add(propAttr.Index,propertyInfo.Name);        }      }      return result.OrderBy(x => x.Key).Select(x => x.Value).ToList();    }    public static string SoringColumnName<T>(string columnIndex)    {      int index;      if (!int.TryParse(columnIndex, out index))      {        throw new ArgumentOutOfRangeException();      }      return SoringColumnName<T>(index);    }    public static string SoringColumnName<T>(int index)    {      var props = typeof(T).GetProperties();      foreach (var propertyInfo in props)      {        var propAttr =          propertyInfo            .GetCustomAttributes(false)            .OfType<SortingColumnAttribute>()            .FirstOrDefault();        if (propAttr != null && propAttr.Index == index)        {          return propertyInfo.Name;        }      }      return "";    }}

Query:


...var query = context.BusCaptains            .Where(x => ...)            .OrderByEx(sortDirection, sortField)            .Skip(start)            .Take(pageSize);...

LINQ Helper :


...public static IQueryable<T> OrderByEx<T>(this IQueryable<T> q, string direction, string fieldName)    {      try      {        var customProperty = typeof(T).GetCustomAttributes(false).OfType<ColumnAttribute>().FirstOrDefault();        if (customProperty != null)        {          fieldName = customProperty.Name;        }        var param = Expression.Parameter(typeof(T), "p");        var prop = Expression.Property(param, fieldName);        var exp = Expression.Lambda(prop, param);        string method = direction.ToLower() == "asc" ? "OrderBy" : "OrderByDescending";        Type[] types = new Type[] {q.ElementType, exp.Body.Type};        var mce = Expression.Call(typeof(Queryable), method, types, q.Expression, exp);        return q.Provider.CreateQuery<T>(mce);      }      catch (Exception ex)      {        _log.ErrorFormat("error form OrderByEx.");        _log.Error(ex);        throw ;      }    }...
相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.