ASP.NET MVC搭建項目後台UI架構—9、伺服器端排序

標籤：

1. ASP.NET MVC搭建項目後台UI架構—1、後台主架構
2. ASP.NET MVC搭建項目後台UI架構—2、菜單特效
3. ASP.NET MVC搭建項目後台UI架構—3、面板摺疊和展開
4. ASP.NET MVC搭建項目後台UI架構—4、tab多頁簽支援
5. ASP.NET MVC搭建項目後台UI架構—5、Demo示範Controller和View的互動
6. ASP.NET MVC搭建項目後台UI架構—6、客戶管理（添加、修改、查詢、分頁）
7. ASP.NET MVC搭建項目後台UI架構—7、統計報表
8. ASP.NET MVC搭建項目後台UI架構—8、將View中選擇的資料行中的部分資料傳入到Controller中
9. ASP.NET MVC搭建項目後台UI架構—9、伺服器端排序

關於jquery datables的在伺服器端的排序，在網上貌似沒有看到.NET的例子，說實話，之前我也迷惑過，習慣了直接從網上找現成的東西，經過一翻搜尋，沒找到，於是乎，自己調試唄，調了前台，調後台，還真被我看出了規律。事實上datables是支援多列排序的，但是本例，我唯寫了單列排序。

在控制器中，

  Dictionary<int, string> dicSort = new Dictionary<int, string>(); //排序欄位索引值對列表 （列序號，列名稱）        /// <summary>        /// 運單異常資料        /// </summary>        /// <returns></returns>        public ActionResult WayBillException(WayBillExceptionFilter filter)        {            return View(filter);        }        public JsonResult WayBillExceptionList(WayBillExceptionFilter filter)        {            dicSort.Add(2, "w.PostingTime");            DataTablesRequest parm = new DataTablesRequest(this.Request);    //處理對象            int pageIndex = parm.iDisplayLength == 0 ? 0 : parm.iDisplayStart / parm.iDisplayLength;            filter.PageIndex = pageIndex;    //頁索引            filter.PageSize = parm.iDisplayLength;    //頁行數            string strSortField = dicSort.Where(x => x.Key == parm.SortColumns[0].Index).Select(x => x.Value).FirstOrDefault();            string strSortDire = parm.SortColumns[0].Direction == SortDirection.Asc ? "asc" : "desc";            filter.OrderBy = " " + strSortField + " " + strSortDire;            var DataSource = Core.Reconciliation.WayBillException.GetByFilter(filter) as WRPageOfList<WayBillException>;            int i = parm.iDisplayLength * pageIndex;            List<WayBillException> queryData = DataSource.ToList();            var data = queryData.Select(u => new            {                Index = ++i, //行號                ID = u.ID,                IsInputCost = u.IsInputCost,                CusName = u.CusName, //客戶簡稱                PostingTime = u.PostingTime == null ? string.Empty : u.PostingTime.Value.ToStringDate(),//收寄日期                ExpressNo = u.ExpressNo, //運單號                BatchNO = u.LoadBillNum, //提單號                Weight = u.Weight == null ? 0m : u.Weight / 1000, //重量                WayBillFee = u.WayBillFee, //郵資                ProcessingFee = u.ProcessingFee, //郵政郵件處理費                InComeWayBillFee = u.ExpressFee, //客戶運費                InComeOprateFee = u.OperateFee, //客戶操作費                WayBillMargins = u.WayBillProfit, //運費毛利                TotalMargins = u.ExpressFee + u.OperateFee + u.InComeOtherFee - (u.WayBillFee + u.ProcessingFee + u.CostOtherFee), //總毛利                Margin = Math.Round((u.ExpressFee + u.OperateFee + u.InComeOtherFee == 0 ? 0m : (u.ExpressFee + u.OperateFee + u.InComeOtherFee -
 (u.WayBillFee + u.ProcessingFee + u.CostOtherFee)) / (u.ExpressFee + u.OperateFee + u.InComeOtherFee) * 100), 2) + "%", 
//毛利率 毛利率=(總收入-總的支出的成本)/總收入*100%                ReconcileDate = u.ReconcileDate.ToStringDate(), //對賬日期                CostOtherFee = u.CostOtherFee, //成本 其他費用                CostTotalFee = u.WayBillFee + u.ProcessingFee + u.CostOtherFee, //成本 總費用                CostStatus = u.CostStatus.ToChinese(),  //成本 狀態                InComeOtherFee = u.InComeOtherFee, //收入 其他費用                InComeTotalFee = u.ExpressFee + u.OperateFee + u.InComeOtherFee, //收入 總費用                InComeStatus = u.InComeStatus.ToChinese(),  //收入 狀態                ExceptionMsg = u.ExceptionMsg, //運單異常原因                WayBillCostID = u.WayBillCostID //運單成本ID                // ExceptionType = u.ExceptionType  //運單異常狀態            });            //decimal totalProfit = 0m;      //總毛利求和            //構造成Json的格式傳遞            var result = new            {                iTotalRecords = DataSource.Count,                iTotalDisplayRecords = DataSource.RecordTotal,                data = data            };            return Json(result, JsonRequestBehavior.AllowGet);        }

在View中，設定datatables的屬性

            bServerSide: true,                    //指定從伺服器端擷取資料              //跟數組下標一樣，第一列從0開始，這裡表格初始化時，第四列預設降序            order: [[2, "desc"]],

當點擊排序的時候，我們可以開啟Firefox瀏覽器的Firebug查看下資料

這個第一列是排序的欄位的列索引，第二個欄位標識有一個排序欄位，因為這個控制項是支援多列排序的。

DataTablesRequest類，裡面我封裝了對這些請求的處理。關於這個類的具體代碼可以參見ASP.NET MVC搭建項目後台UI架構—7、統計報表

            string strSortField = dicSort.Where(x => x.Key == parm.SortColumns[0].Index).Select(x => x.Value).FirstOrDefault();
            string strSortDire = parm.SortColumns[0].Direction == SortDirection.Asc ? "asc" : "desc";

 

ASP.NET MVC搭建項目後台UI架構—9、伺服器端排序