前言：這段時(shí)間一直沒有寫博客，首先是我正在實(shí)現(xiàn)權(quán)限系列的絕色和操作的實(shí)現(xiàn)，因?yàn)檫@些東西在前面我們都已經(jīng)說(shuō)過(guò)了，所以我們就不重復(fù)的說(shuō)這些了，那么我們知道，在我們使用Json返回?cái)?shù)據(jù)的時(shí)候時(shí)間的格式一般都會(huì)變了，變成我們不認(rèn)識(shí)的一些字符，那么當(dāng)我們遇到這些問(wèn)題的時(shí)候我們?cè)撛趺唇鉀Q呢，今天我就來(lái)小說(shuō)一下這個(gè)的解決方法。
.發(fā)現(xiàn)問(wèn)題
(1).正如我們?cè)谇把岳锩嫠f(shuō)，我們?cè)诰帉慗son解析時(shí)間的時(shí)候會(huì)返回一些莫名其妙的東西，那么我們是如何解決這個(gè)問(wèn)題的呢？我現(xiàn)在有兩種方法可以解決這個(gè)問(wèn)題，下面我們首先來(lái)說(shuō)一下思路。
(2).第一種解決方案就是我們使用Jquery來(lái)解決，我們知道，當(dāng)值從Json傳遞到前臺(tái)進(jìn)行賦值的時(shí)候我們可以對(duì)其進(jìn)行操作，使之可以直接反編譯出時(shí)間顯示在項(xiàng)目上面。
(3).第二種解決方案就是我直接使用C#代碼在后臺(tái)就編譯好然后直接傳遞到前臺(tái)顯示。
(4).那么下面我們看一下如果我們沒有解析Json的話傳遞過(guò)來(lái)的時(shí)間的格式如圖所示：
.前臺(tái)使用Jquery解決
(1)如果我們前臺(tái)使用Jquery來(lái)解決這個(gè)問(wèn)題的話，那么我們首先想到的是我們?nèi)绾谓馕鲞@個(gè)過(guò)程呢，當(dāng)然我們就想到了自己寫一個(gè)JavaScript腳本來(lái)解析這個(gè)過(guò)程，當(dāng)然這個(gè)腳本不是我寫的了，而是別人寫的，自己拿過(guò)來(lái)用，腳本代碼如下：
//by 韓迎龍
/**
* 對(duì)Date的擴(kuò)展，將 Date 轉(zhuǎn)化為指定格式的String
* 月(M)、日(d)、12小時(shí)(h)、24小時(shí)(H)、分(m)、秒(s)、周(E)、季度(q) 可以用 1-2 個(gè)占位符
* 年(y)可以用 1-4 個(gè)占位符，毫秒(S)只能用 1 個(gè)占位符(是 1-3 位的數(shù)字)
* eg:
* (new Date()).pattern("yyyy-MM-dd hh:mm:ss.S") ==> 2006-07-02 08:09:04.423
* (new Date()).pattern("yyyy-MM-dd E HH:mm:ss") ==> 2009-03-10 二 20:09:04
* (new Date()).pattern("yyyy-MM-dd EE hh:mm:ss") ==> 2009-03-10 周二 08:09:04
* (new Date()).pattern("yyyy-MM-dd EEE hh:mm:ss") ==> 2009-03-10 星期二 08:09:04
* (new Date()).pattern("yyyy-M-d h:m:s.S") ==> 2006-7-2 8:9:4.18
使用：(eval(value.replace(/\/Date\((\d+)\)\//gi, "new Date($1)"))).pattern("yyyy-M-d h:m:s.S");
*/
Date.prototype.pattern = function (fmt) {
var o = {
"M+": this.getMonth() + 1, //月份
"d+": this.getDate(), //日
"h+": this.getHours() % 12 == 0 ? 12 : this.getHours() % 12, //小時(shí)
"H+": this.getHours(), //小時(shí)
"m+": this.getMinutes(), //分
"s+": this.getSeconds(), //秒
"q+": Math.floor((this.getMonth() + 3) / 3), //季度
"S": this.getMilliseconds() //毫秒
};
var week = {
"0": "/u65e5",
"1": "/u4e00",
"2": "/u4e8c",
"3": "/u4e09",
"4": "/u56db",
"5": "/u4e94",
"6": "/u516d"
};
if (/(y+)/.test(fmt)) {
fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
}
if (/(E+)/.test(fmt)) {
fmt = fmt.replace(RegExp.$1, ((RegExp.$1.length > 1) ? (RegExp.$1.length > 2 ? "/u661f/u671f" : "/u5468") : "") + week[this.getDay() + ""]);
}
for (var k in o) {
if (new RegExp("(" + k + ")").test(fmt)) {
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
}
}
return fmt;
}
(2)當(dāng)我們寫完上面的腳本之后，這時(shí)候我們就需要在頁(yè)面中使用這個(gè)腳本的信息，那么我們?nèi)绾问褂眠@個(gè)信息，當(dāng)然我們首先需要引用這個(gè)對(duì)象：
@*日期格式的引用*@
<script src="@Url.Content("~/Content/datapattern.js")"></script>
(3)這時(shí)候當(dāng)我們引用完畢后，我們也就差最后一步了，這時(shí)候我們就需要設(shè)置easyUI顯示數(shù)據(jù)的格式哪里調(diào)用上面我們書寫的Json解析的腳本，代碼如下：
frozenColumns: [[
{ field: 'ck', checkbox: true }, //選擇
{ title: '主鍵', field: 'ID', width: 40, sortable: true }, //主鍵
{ title: '角色名稱', field: 'Realname', width: 100, sortable: true }, //登錄名
{ title: '角色類型', field: 'CategoryCode', width: 100, sortable: true }, //用戶名
{ title: '排序碼', field: 'SortCode', width: 100, sortable: true },
{ title: '創(chuàng)建人', field: 'CreateBy', width: 90, sortable: true },
{
title: '創(chuàng)建時(shí)間', field: 'CreateOn', width: 140, sortable: true,
formatter: function (value, row, index) {
return (eval(value.replace(/\/Date\((\d+)\)\//gi, "new Date($1)"))).pattern("yyyy-M-d h:m:s");
}
},
{ title: '最后修改人', field: 'ModifiedBy', width: 90, sortable: true },
{ title: '修改時(shí)間', field: 'ModifiedOn', width: 140, sortable: true }
]],
(4)最后我們可以看一下轉(zhuǎn)換后的想過(guò)如圖所示：
.后臺(tái)使用基類來(lái)解決
(1)上面我們說(shuō)了第一種方法，那么我們現(xiàn)在來(lái)說(shuō)第二種方法，第二種方法的話我們從標(biāo)題就看出來(lái)了，我們是使用后臺(tái)的基類來(lái)實(shí)現(xiàn)這個(gè)效果的，那么我們知道我們?cè)谝郧暗牟┛椭形覀兘⒘艘粋€(gè)BaseController基倉(cāng)儲(chǔ)，我們?cè)谶@里就需要用到基倉(cāng)儲(chǔ)了。
(2)在基倉(cāng)儲(chǔ)里面我們寫了如下的方法，在這個(gè)方法中我們用到了一些處理時(shí)間的對(duì)象，大家可以自己研究一下：
/// <summary>
/// 返回處理過(guò)的時(shí)間的Json字符串
/// </summary>
/// <param name="Date"></param>
/// <returns></returns>
public ContentResult JsonDate(object Date)
{
var timeConverter = new IsoDateTimeConverter { DateTimeFormat = "yyyy-MM-dd HH:mm:ss" };
return Content(JsonConvert.SerializeObject(Date, Formatting.Indented, timeConverter));
}
(3)接下來(lái)我們就需要在我們的實(shí)現(xiàn)功能的控制器中調(diào)用這個(gè)方法來(lái)返回對(duì)象，角色控制器的代碼如下：
/// <summary>
/// 獲得角色的信息顯示在角色列表中
/// </summary>
/// <returns>返回角色信息的Json對(duì)象</returns>
public ActionResult GetAllRoleInfos()
{
//實(shí)現(xiàn)對(duì)用戶和多條件的分頁(yè)的查詢，rows表示一共多少條，page表示當(dāng)前第幾頁(yè)
int pageIndex = Request["page"] == null ? 1 : int.Parse(Request["page"]);
int pageSize = Request["rows"] == null ? 10 : int.Parse(Request["rows"]);
string RealName = Request["RealName"];
int? Enabled = Request["Enabled"] == null ? -1 : int.Parse(Request["Enabled"]);
int? CategoryCode = Request["CategoryCode"] == null ? -1 : int.Parse(Request["CategoryCode"]);
int total = 0;
//封裝一個(gè)業(yè)務(wù)邏輯層的方法來(lái)處理多條件查詢的信息
RoleInfoQuery roleinfo = new RoleInfoQuery()
{
PageIndex = pageIndex,
PageSize = pageSize,
RealName = RealName,
Enabled = Enabled,
CategoryCode = CategoryCode,
Total = 0
};
var date = _roleInfo.loadSearchDate(roleinfo);
//構(gòu)造Json對(duì)象返回
var result = new { total = roleinfo.Total, rows = date };
return JsonDate(result);
}
(4)最后我們的前臺(tái)恢復(fù)到原始的狀態(tài)，不用變，實(shí)現(xiàn)的功能如圖所示：
