写在前面


上一小节,我们使用Dapper 里事务实现了一对多关系的添加。这一小节,主要记录如何使用Dapper 实现多表的查询显示。

产生问题


在mvc控制器中查询显示以JsonResult 返回 Json格式给前台时。无可避免的日期格式不是我们想要的日期格式。而是类似于这样的/Date(1565664248000)/日期格式。

解决方案


  • 方案1 可以使用Newtonsoft.Json 里IsoDateTimeConverter 类格式化ISO格式的日期
//使用IsoDateTimeConverter 类必须引用一下两个方法
using Newtonsoft.Json;
using Newtonsoft.Json.Linq; public string Load(){
//此处省略获取数据方法 //最后返回sring
IsoDateTimeConverter timeFormat = new IsoDateTimeConverter();
timeFormat.DateTimeFormat = "yyyy-MM-dd HH:mm:ss";
return JsonConvert.SerializeObject(result, Formatting.Indented, timeFormat);
}

其中 result 就是返回给前台的字符串。不过,需要注意的是使用方法1时,前台必须转成Json对象。

  • 方案2 仍然使用的是JsonResult 的方法返回Json。不过,我们需要拓展JsonResult类。
  • 在DbOption文件夹中,创建my.JsonMvc类。
namespace my.JsonMvc
{
public static class MvcExtendsion
{
public static JsonResult MyJson(object data, JsonRequestBehavior behavior, string format)
{
return new ToJsonResult
{
Data = data,
JsonRequestBehavior = behavior,
FormatString = format
};
} public class ToJsonResult : JsonResult
{
const string error = "该请求已被封锁,因为敏感信息透露给第三方网站,这是一个GET请求时使用的。为了可以GET请求,请设置JsonRequestBehavior AllowGet。";
/// <summary>
/// 格式化字符串
/// </summary>
public string FormatString { get; set; }
public override void ExecuteResult(ControllerContext context)
{
if (context == null)
{
throw new ArgumentNullException("context");
}
if (JsonRequestBehavior == JsonRequestBehavior.DenyGet &&
String.Equals(context.HttpContext.Request.HttpMethod, "GET", StringComparison.OrdinalIgnoreCase))
{
throw new InvalidOperationException(error);
} HttpResponseBase response = context.HttpContext.Response; if (!String.IsNullOrEmpty(ContentType))
{
response.ContentType = ContentType;
}
else
{
response.ContentType = "application/json";
}
if (ContentEncoding != null)
{
response.ContentEncoding = ContentEncoding;
}
if (Data != null)
{
JavaScriptSerializer serializer = new JavaScriptSerializer();
string jsonstring = serializer.Serialize(Data);
string p = @"\\/Date\(\d+\)\\/";
MatchEvaluator matchEvaluator = new MatchEvaluator(ConvertJsonDateToDateString);
Regex reg = new Regex(p);
jsonstring = reg.Replace(jsonstring, matchEvaluator);
response.Write(jsonstring);
}
} /// <summary>
/// 将Json序列化的时间由/Date(1294499956278+0800)转为字符串
/// </summary>
private string ConvertJsonDateToDateString(Match m)
{
string result = string.Empty;
string p = @"\d";
var cArray = m.Value.ToCharArray();
StringBuilder sb = new StringBuilder(); Regex reg = new Regex(p);
for (int i = 0; i < cArray.Length; i++)
{
if (reg.IsMatch(cArray[i].ToString()))
{
sb.Append(cArray[i]);
}
}
DateTime dt = new DateTime(1970, 1, 1);
dt = dt.AddMilliseconds(long.Parse(sb.ToString()));
dt = dt.ToLocalTime();
result = dt.ToString(FormatString);
return result;
}
}
}
}
  • 然后,在控制器中引用拓展的类。
using my.JsonMvc;//引用拓展类

public JsonResult Load()
{
//此处省略获取数据方法 //最后返回Json
return MvcExtendsion.MyJson(result, JsonRequestBehavior.AllowGet, "yyyy-MM-dd HH:mm:ss");
}

最后,我选择了方案2解决了格式化日期的问题。

以下是完整的多表查询代码。

  • BorrowBookController 控制器中 创建 index 视图
/// <summary>
/// 创建添加视图
/// </summary>
/// <returns></returns>
public ActionResult Add()
{
return View();
}
  • 创建 Load_Borrow_Data方法
//<summary>
//获取借书数据
//</summary>
//<returns></returns>
//splitOn 读取Reader 从右到左
public JsonResult Load_Borrow_Data()
{
using (var conn = ConnectionFactory.MysqlConn())
{
string sql_query = "select a.book_Id,a.book_Num,a.book_Name,a.book_Desc,a.borow_Time, ";
sql_query += "b.book_Type_id,b.book_Type_Name,c.user_name";
sql_query += " from sys_Borrow_Book a join sys_Book_Type b on a.book_Type_id=b.book_Type_id left join sys_Borrow_User c ";
sql_query += " on a.user_Id=c.user_Id "; var result = conn.Query<sys_Borrow_Book, sys_Book_Type, sys_Borrow_User, sys_Borrow_Book>(sql_query,
(books, bkys, users) =>
{
books.borrow_types = bkys;
books.borrow_users = users;
return books;
}, splitOn: "book_Type_Name,user_name").ToList();
return MvcExtendsion.MyJson(result, JsonRequestBehavior.AllowGet, "yyyy-MM-dd HH:mm:ss");
}
}
  • View 视图中创建 index视图
<div class="layui-container">
<div class="layui-row">
<h2 style="margin-top:10px;">借书列表</h2>
<hr class="layui-bg-green">
<button class="layui-btn layui-btn-sm" id="btnAdd"><i class="layui-icon"></i> 新增</button>
<div class="layui-col-md12">
<table class="layui-table" id="bind_tb">
<thead>
<tr>
<th>序号</th>
<th>书籍类型</th>
<th>借书编号</th>
<th>借书书名</th>
<th>借书人</th>
<th>借书时间</th>
<th>操作</th>
</tr>
</thead>
</table>
</div>
</div>
</div>
  • index视图中操作dom
<script type="text/javascript">
Load();
/*1.获取数据*/
function Load() {
$.ajax({
url: "../BorrowBook/Load_Borrow_Data",
type: "Get",
}).done(function (msg) {
var str_tb = "";
$("#bind_tb tr:gt(0)").remove();
debugger;
if ($.isEmptyObject(msg) == false) {
$.each(msg, function (i, obj) {
str_tb += "<tr>";
str_tb += "<td>" + (i + 1) + "</td>";
str_tb += "<td>" + obj.borrow_types.book_Type_Name + "</td>";
str_tb += "<td>" + obj.book_Num + "</td>";
str_tb += "<td>" + obj.book_Name + "</td>";
str_tb += "<td>" + obj.borrow_users.user_name + "</td>";
str_tb += "<td>" + obj.borow_Time + "</td>";
str_tb += "<td><button class='layui-btn layui-btn-normal layui-btn-xs btnedit' id=" + obj.book_Type_id + "><i class='layui-icon'></i>编辑</button>";
str_tb += "<button class='layui-btn layui-btn-danger layui-btn-xs btndel' id=" + obj.book_Id + "><i class='layui-icon'></i>删除</button></td>";
str_tb += "</tr>";
});
$("#bind_tb").append(str_tb);
} else {
//$("#bind_tb tr:gt(0)").remove();
var str_error = "<tr><td colspan='7' style='text-align:center;'>暂无数据</td></tr>";
$("#bind_tb").append(str_error);
}
}).fail(function (e) { });
}
</script>

最终效果:

.net Dapper 实践系列(3) ---数据显示(Layui+Ajax+Dapper+MySQL)的更多相关文章

  1. .net Dapper 实践系列(1) ---项目搭建(Layui+Ajax+Dapper+MySQL)

    目录 写在前面 一.前期准备 1.在MySQL创建数据库 2.创建项目 3.安装程序包 4.添加插件 5.添加DbOption文件夹 6.添加实体类 写在前面 学习并实践使用Dapper 这个小型的O ...

  2. .net Dapper 实践系列(4) ---数据查询(Layui+Ajax+Dapper+MySQL)

    写在前面 上一小节,总结了数据显示时,会出现的日期问题.以及如何处理格式化日期.这个小节,主要总结的是使用Dapper 中的QueryMultiple方法依次显示查询多表的数据. 实践步骤 1.在Bo ...

  3. .net Dapper 实践系列(5) ---事务编辑(Layui+Ajax+Dapper+MySQL)

    目录 写在前面 实践步骤 写在前面 上一小节,我们总结了根据Id查询多表数据,最后返回Json对象给前台的例子.接下来,在这一小节我们要实现多表编辑的操作. 实践步骤 因为上一小节以及创建了Edit视 ...

  4. .net Dapper 实践系列(2) ---事务添加(Layui+Ajax+Dapper+MySQL)

    目录 写在前面 问题描述 解决方法 具体实现 写在前面 前面我们已经搭建好了项目,这一小节我们使用Dapper 中的事务实现一对多的添加操作. 问题描述 在做添加的时候很头疼需要从页面传递一组数据到后 ...

  5. .net Dapper 实践系列(6) ---事务删除(Layui+Ajax+Dapper+MySQL)

    目录 写在前面 实现步骤 写在最后 写在前面 上一小节,总结了事务多表更新的两种方法.一个是只更新原来的数据,一个是先删除原来的数据再往里面添加新的数据.而这一小节,说的是事务的多表删除. 实现步骤 ...

  6. .net core实践系列之SSO-跨域实现

    前言 接着上篇的<.net core实践系列之SSO-同域实现>,这次来聊聊SSO跨域的实现方式.这次虽说是.net core实践,但是核心点使用jquery居多. 建议看这篇文章的朋友可 ...

  7. .net Dapper 学习系列(1) ---Dapper入门

    目录 写在前面 为什么选择Dapper 在项目中安装Dapper 在项目中使用Dapper 在项目中使用Dapper 进行单表增删改数据操作 总结 写在前面 Dapper 是一款轻量级ORM架构.为解 ...

  8. Nagios学习实践系列——基本安装篇

    开篇介绍 最近由于工作需要,学习研究了一下Nagios的安装.配置.使用,关于Nagios的介绍,可以参考我上篇随笔Nagios学习实践系列——产品介绍篇 实验环境 操作系统:Red Hat Ente ...

  9. Nagios学习实践系列——配置研究[监控当前服务器]

    其实上篇Nagios学习实践系列——基本安装篇只是安装了Nagios基本组件,虽然能够打开主页,但是如果不配置相关配置文件文件,那么左边菜单很多页面都打不开,相当于只是一个空壳子.接下来,我们来学习研 ...

随机推荐

  1. java读取文件夹下文件及txt内容

    public class PositionController {     // 读取txt内容     public static String txt2String(File file) {    ...

  2. Java里方法的参数传递方式

    Java里方法的参数传递方式只有一种:值传递. Java中参数传递的都是参数值 下面从两个维度来看 1.传递的参数是8种基本数据类型 这个比较好理解,8种基本数据类型,作为参数时,可以理解为原来的一个 ...

  3. Spring Cloud 学习--Hystrix应用

    上一篇介绍了Hystrix基本功能和单独使用的方式,今天继续学习如何将Hystrix融入SpringCloud组件中去. 在Ribbon上使用熔断器 在 pom.xml 文件中引入 hystrix 的 ...

  4. phpstudy(小皮面板)和phpstudy2018 配置php的区别

    phpstudy(小皮面板)和phpstudy2018 配置php的区别 一.总结 一句话总结: phpstudy(小皮面板) 和 phpstudy2018 只是引入的php的位置不同,但是核心代码还 ...

  5. 基于cesium的GIS洪水淹没三维模拟系统

    简介: “FloodFreeth3D”是一款对Mike11软件计算的洪水演进结果使用cesium进行淹没演进三维模拟的软件产品.   技术参数: 1. B/S架构,支持多Web浏览器(ie.chrom ...

  6. oracle使用Union时遇到列格式clob和varchar2不符,不能转的问题

    其实这个很简单,思路就是把clob转为varchar,在查询的时候使用dbms_lob.substr(coulmn,4000):就可以把指定列从clob转化为varchar2.

  7. clumsy 模拟网络丢包延迟

    https://www.cnblogs.com/bodboy/p/6015530.html clumsy 能在 Windows 平台下人工造成不稳定的网络状况,方便你调试应用程序在极端网络状况下的表现 ...

  8. hive删除空分区

    当hive中分区字段有NULL值时,hive会使用dynamic partition,数据会放到一个特殊的分区,这个分区由参数“hive.exec.default.partition.name”控制, ...

  9. SpringMVC异步处理 可使用的返回值类型

    CallableMethodReturnValueHandler Callable.class.isAssignableFrom(returnType.getParameterType()); Def ...

  10. javascript – Node.js请求CERT_HAS_EXPIRED

    javascript – Node.js请求CERT_HAS_EXPIRED 转  http://www.voidcn.com/article/p-ssctwovd-bsy.html 原文   htt ...