Question

我正在尝试显示从jquery数据表中的数据库获取的数据，因为数据量很大。我的操作方法返回json数据。当我运行应用程序时，它只显示json数据，但数据表的结构不起作用。任何人都可以告诉我应该如何使它工作？请找到以下代码......

控制器：

public class SupportingChannelController : Controller
{
    // GET: SupportingChannel
    List<SupportingChannel> _list = null;
    SupportingChannelBL _bl = new SupportingChannelBL();
    SupportingChannelDataVM _data = new SupportingChannelDataVM();

    public ActionResult GetChannelData()
    {
        return View("SupportingChannel");
    }
    public JsonResult GetSupportingChannelData()
    {
        _list = _bl.channel();

        _data._model = _list;
        return Json(new { data = _list }, JsonRequestBehavior.AllowGet);
    }
}

查看

@model MultiRequestInterface.Models.SupportingChannelDataVM
@{
ViewBag.Title = "SupportingChannel";
 }
<link 
href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css" />
<h2>Supporting Channels</h2>
@using (Html.BeginForm("getComType","SupportingChannel",FormMethod.Post))
{

<div>

    <style>
        table,th,td{
            border: 1px solid black;
            border-collapse: collapse;
           align-content:center;
        }
    </style>
    <div style="border:solid;width:100%;overflow-x:auto;">
        <table  id="table" align="center" style="width:100%" 
class="display">
            <thead>
                <tr>
                    <th>Communication Type</th>
                    <th>Communication Description</th>
                </tr>
            </thead>

        </table>
        </div>
        <input type="submit" name="submit" value="submit" />
    </div>
 if (TempData["testmsg"] != null)
 {
    <script type="text/javascript">
   alert("@TempData["testmsg"]");
    </script>
  }


<script src="https://code.jquery.com/jquery-3.2.1.min.js"
        integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
        crossorigin="anonymous"></script>
<script 
src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js">

</script>
<script>

    $(document).ready(function ()
    {

       $('#table').DataTable({
           "ajax": {
           "url": "@Url.Action("GetSupportingChannelData", 
 "SupportingChannel")", // action method URL
           "type": "GET",
           "datatype": "json"
           },
      columns: [
                  { data: "CommunicationType", searchable: false, title: 
'CommunicationType' },
                  { data: "CommunicationTypeDescription", searchable: false, 
title: 'CommunicationTypeDescription' },

              ],

          });
    });
    </script>

snapshot

GetchannelData

Jquery数据表未加载

0 个答案: