使用 dataTable jQuery 插件时无法从 asp.net MVC 数据注释和 HTML 帮助程序中受益

Question

我正在研究以下内容：-

• asp.net MVC5 Web 应用程序。
• dataTable jQuery 插件版本 1.10.4

但是我已经注意到，如果我使用DataTable插件，我无法从这些 asp.net MVC功能中受益：-

• 我不能使用 html 助手。

• 应用的数据批注将不起作用。

例如，我有以下脚本来实现数据表插件：-

<script type="text/javascript">
        $(document).ready(function () {
            $('#myDataTable').dataTable({
                "serverSide": true,
                "ajax": "Home/AjaxHandler",
                "processing": true,
                "columns": [
                            { "data": "FName" },
                            { "data": "LName" },
                            { "data": "BDate" }
                ]
            });
        });
    </script>

以及以下操作方法：-

 public ActionResult AjaxHandler(jQueryDataTableParamModel param)
            {
                var allCompanies = t.Emps;
                var result = allCompanies.Select(c=> new {c.FName, c.LName, c.BDate});
                           //  select new[] {  };
                return Json(new
                {
                    sEcho = param.sEcho,
                    iTotalRecords = allCompanies.Count(),
                    iTotalDisplayRecords = allCompanies.Count(),
                    aaData = result
                },
                                JsonRequestBehavior.AllowGet);
            }

以及以下观点：-

@{
    ViewBag.Title = "Home Page";
}


<table id="myDataTable" class="display">
    <thead>
        <tr>
            <th>FName</th>
            <th>LName</th>
            <th>BDate</th>
        </tr>
    </thead>
    <tbody></tbody>
</table> 

以及以下模型：-

namespace testplugins.Models
{
    using System;
    using System.Collections.Generic;
    using System.ComponentModel.DataAnnotations;
    public partial class Emp
    {
        public int EmpID { get; set; }
       [Display(Name = "First Name")]
        public string FName { get; set; }
        [Display(Name = "Last Name")]
        public string LName { get; set; }
        public Nullable<int> DeptID { get; set; }
        [DataType(DataType.Date)]
        public Nullable<System.DateTime> BDate { get; set; }
        public virtual Dept Dept { get; set; }
    }
}

例如，现在我不能使用Html.DisplayNameFor(a=>a.FName)并获取数据注释中定义的名称。 取而代之的是，我需要手动编写 HTML 表标题标签。

同样对于 Bdate，dataTable 中的值将显示为"/Date（315536524000）/"，所以我甚至无法从DataType.Date数据注释中受益，此外，如果我要使用 dataTable 插件编辑记录，那么数据注释（例如必需，字符串长度）也不会有任何影响。

那么任何人都可以就此提出建议吗？ 我可以修改 dataTable 插件以更 asp.net 面向 MVC 吗？ 还是我在上面的代码中做错了事情？

Answer 1

这是您可以完成此操作的一种方法...

这只是创建一个小模板字符串，将其放入 JS 变量中，并使用 render 函数输出该字符串以及 value 属性中的数据。

剃刀：

@model testplugins.Models.Emp

<table id="myDataTable" class="display">
    <thead>
        <tr>
            <th>FName</th>
            <th>LName</th>
            <th>BDate</th>
        </tr>
    </thead>
    <tbody></tbody>
</table> 
<script type="text/javascript">
    var fnameTextBox = '@Html.TextBoxFor(m => m.FName)';
</script>

.JS

<script type="text/javascript">
    $(document).ready(function () {
        $('#myDataTable').dataTable({
            "serverSide": true,
            "ajax": "Home/AjaxHandler",
            "processing": true,
            "columns": [
                    { "data": "FName" },
                    { "data": "LName" },
                    { "data": "BDate" }
            ],
            "render": function( data, type, row, meta ){
                 return fnameTextBox.replace('value=""', 'value="' + data + '"');
            }
         });
    });
</script>