使用Ajax(asp.net,mvc)加载jQuery DataTable

时间:2018-08-09 10:05:51

标签: asp.net-mvc datatables asp.net-web-api2

我正在尝试使用web.api加载DataTable

我的HTML代码如下

    <button id="refresh">Refresh</button>
    <button id="AddRow">Add New Row</button>
    <table id="stdTable" class="table table-bordered table-striped" width="100%">
        <thead>
            <tr>
                <th>Id</th>
                <th>Name</th>
                <th>Age</th>
                <th>Date of birth</th>
                <th>Edit/View</th>
            </tr>
        </thead>
    </table>

我的模态是波纹管

public class StudentModel {
    [Key]
    public int Id { get; set; }
    public String Name { get; set; }
    public int Age { get; set; }
    public DateTime DateofBirth { get; set; }
}

1 个答案:

答案 0 :(得分:1)

请按照下面的步骤

  1. 我正在使用v 1.10.12安装NeGet软件包“ jquery.datatables”

  2. 添加Web API控制器并添加方法为波纹管

 [HttpGet]
    public IHttpActionResult LoadStudents() {
        using (AppDbContext db = new AppDbContext()) {
            var s = db.Studets.ToList(); 
            var json = JsonConvert.SerializeObject(s);         
            string yourJson = json;
            var response = this.Request.CreateResponse(HttpStatusCode.OK);
            response.Content = new StringContent( yourJson, Encoding.UTF8, "application/json");
            return ResponseMessage(response);
        }
    }

jQuery Script as bellow

 [HttpGet]
    public IHttpActionResult LoadStudents() {
        using (AppDbContext db = new AppDbContext()) {
            var s = db.Studets.ToList(); 
            var json = JsonConvert.SerializeObject(s);         
            string yourJson = json;
            var response = this.Request.CreateResponse(HttpStatusCode.OK);
            response.Content = new StringContent( yourJson, Encoding.UTF8, "application/json");
            return ResponseMessage(response);
        }
    }