本文主要介绍在Web窗体项目中,使用 JQuery DataTables插件需要解决的一些问题。

JQuery DataTables 服务端模式 是 Ajax请求获取数据的, 在Web窗体项目中,我们一般使用 ashx(一般处理程序) 或者 WebService 来 处理Ajax请求。

由于 ashx 或者 webservice 没有 MVC 的模型层,在MVC 中,我们可以直接写一个 DataTables请求表单的模型,把 model 作为 Action 的参数,数据直接就可以对应到 模型里,非常方便。

但是 ashx 和 webservice 却无法实现这样的功能 , 那我们在查询的时候,JQuery DataTables 如何传递查询参数,ashx 又如何接收查询参数呐?

假设我们有 一堆查询条件,如下图,该如何传递:

JQuery DataTables 传递查询参数

我们可以直接使用全局搜索API(search方法), 面对多个查询条件, 我们可以使用 JSON数组,传递查询参数, 而后 将 JSON 数组序列化成字符串, 赋给 Search[value] ,而后在服务端 反序列化即可。

  • 注意: 一定要讲 JSON 数组 序列成 字符串, 不然 JSON 数组 将任然以 search[value][条件一],search[value][条件二] 数组的方式传递。

所以我们一定要 将 JSON 数组 序列化成字符串 : "{\"条件一\": xxx,\"条件二\": xxx,}"

/*检索*/ $( '#searchBtn' ).click( function () { var _search_param = { "CityName" : $.trim($( '#city' ).val()), "AnswerCount" : $.trim($( '#answerCount' ).val()), "IsReal" : $.trim($( "#askfrom" ).val()), "ContainManagerUser" : $.trim($( '#containManagerUser' ).val()), "Source" : $.trim($( '#source' ).val()), //... var paramStr = JSON .stringify(_search_param); // 将参数序列化 page_dt.search(paramStr).draw(); //执行查询

序列化后的参数传递如下:

ashx 或 webservice 接收 查询参数

// 查询方法
   private void GetAskList(HttpContext context)
        AskViewModel param = new AskViewModel();//正式查询参数
        //获取查询参数
        //直接将 JSON 参数,反序列化成实体集模型,非常方便
        AskViewModel _param = new JavaScriptSerializer().Deserialize<AskViewModel>(context.Request["search[value]"]);
        //...执行查询,并返回结果