jquery - Jquery Datatable不使用MVC显示

问题描述

我正在尝试使用 Jquery 数据表显示来自 SQL 查询的数据。我的问题是视图中的数据表没有正确显示，如附图所示。看不到我做错了什么我取出了部分代码。从数据库中检索数据没有任何问题

html代码

<table id="tblPatientHealthRecord" class="table table-bordered table-striped" style="width: 100% !important;">
    <thead>
         <tr>
            <th>Record ID</th>

          </tr>
      </thead>
   </table>

C# 代码

public class HealthRecordController : Controller
{
    // GET: HealthRecord
    public ActionResult Index(int id)
    {
        ViewBag.patientid = id;


        List<HealthRecordata> HealthRecordList = new List<HealthRecordata>();
  // Oracle connection to table health record
        using (OracleConnection conn = new OracleConnection(WebConfigurationManager.ConnectionStrings["HealthRecord"].ConnectionString))
        {
            conn.Open();
            OracleCommand cmd = new OracleCommand();
            cmd.Connection = conn;
            cmd.CommandText = @"SELECT                                                                   
                                       hr.record                                               
                                        FROM
                                            health_records hr
                                            LEFT JOIN health_record_types hrt ON hr.record_type = hrt.code
                                            LEFT JOIN media_types mt ON hr.media_type = mt.code
                                            Where  hr.patient=:PatientId";
            cmd.CommandType = CommandType.Text;
            cmd.Parameters.Add("PatientId", id);
            OracleDataReader rdr = cmd.ExecuteReader();

            while (rdr.Read())
            {
                var healthrecord = new HealthRecordata();                  
                HealthRecordList.Add(healthrecord);
            }
        }
        return Json(new { data = HealthRecordList }, JsonRequestBehavior.AllowGet);

    }

Javascript代码

   @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/bootstrap")
    @Styles.Render("~/bundles/datatablecss")
    @Scripts.Render("~/bundles/table")
<script type="text/javascript">
        $(document).ready(function () {
            $('#tblPatientHealthRecord').DataTable({
                ajax: {
                    "url": "/HealthRecord/Index",
                    "type": "GET",
                    "dataType": "json", 
                },               
                columns: [
                    {
                      "data": "Record"                      
                    },

                ]
            });
        });
 </script>

标签： jqueryasp.net-mvcdatatable

也许试试这个：

$(document).ready(function () {


            $.get("/HealthRecord/Index", function (data) {
                var jsonData = data;

                $('#tblPatientHealthRecord').DataTable({
                    data: jsonData,
                    columns: [
                        { data: "Record" },

                    ]


                });
            });


        });

https://dotnetfiddle.net/05jCka

jquery - Jquery Datatable不使用MVC显示

问题描述

解决方案

推荐阅读