数据表在初始加载时停留在“处理”上

我试图从我的控制器获取AJAX来填充我的数据表。 我用POSTMAN测试了我的GET并且它提供了正确的AJAX,并且成功:函数在我的DataTable上正常工作。

但是,当我加载页面时,DataTable卡在“处理”上。 我已经尝试过更改处理和服务旁边,它仍然无法正常工作。

当我打开ServerSide:True它收到错误:

jquery-1.10.2.js:8720 GET http://localhost:51326/Table/Index?draw=1&columns%5B0%5D%5Bdata%5D=0&column…art=0&length=10&search%5Bvalue%5D=&search%5Bregex%5D=false&_=1480635427759 404 (Not Found) 

这是我的Controller提供数据,以及用于创建AJAX的类。

 public class stockAJAX { public int StockId { get; set; } public string ProductGroup { get; set; } public string GroupType { get; set; } public string ItemType { get; set; } public string Model { get; set; } public string SerialNo { get; set; } public string NR { get; set; } public string Status { get; set; } public string Description { get; set; } public string DateArrived { get; set; } public int? CurrentLocation { get; set; } public string TerminalId { get; set; } } public class TableController : Controller { List stock = new List(); stockAJAX ajaxTemp = new stockAJAX(); static string csv; [AcceptVerbs(HttpVerbs.Get | HttpVerbs.Post)] public JsonResult getAJAX() { using (TableEntities context = new TableEntities()) { stock = (from c in context.stocks select new stockAJAX { StockId = c.StockId, ProductGroup = c.ProductGroup, GroupType = c.GroupType, ItemType = c.ItemType, Model = c.Model, SerialNo = c.SerialNo, NR = c.NR, Status = c.Status.ToString(), Description = c.Description, DateArrived = c.DateArrived.ToString(), CurrentLocation = c.CurrentLocation, TerminalId = c.TerminalId, } ).Take(1000).ToList(); } return Json(stock, JsonRequestBehavior.AllowGet); } 

这是我的视图中与我的数据表相关的javascript:

 var Json = [ {StockId: 0, ProductGroup: " ", GroupType: " ", ItemType: " " , Model: " " , SerialNo: " ", NR: " " , Status: " ", Description: " ", DateArrived: " " , CurrentLocation: 0, TerminalId: " ", }, ]; $("#myTable").DataTable({ "serverSide": true, "processing": true, "JQueryUI": true, "stateSave": true, "ajax": $.ajax({ contentType: 'application/json; charset=utf-8', dataType: 'json', type: 'GET', url: '/Table/getAJAX', data: Json, failure: function() {alert("unavailable AJAX");}, }) }); $('#loading').hide(); $('#myTable').show(); $("#myTable").DataTable().columns().every( function () { var that = this; $( 'input', this.footer() ).on( 'keyup change', function () { if ( that.search() !== this.value ) { that .search( this.value ) .draw(); } } ); } ); }); 

和我的数据表在这里:

 
Stock Id Product Group Group Type Item Type Model Serial No NR Status Description Date Arrived Current Location Terminal ID
Id Product Group Item Model Serial NR Status Descr Date Location T-ID

编辑:

这是我在控制器中的索引function:

 [AcceptVerbs(HttpVerbs.Get | HttpVerbs.Post)] public ActionResult Index(System.Web.Mvc.FormCollection collection) { //DateTime lastMonth = DateTime.Today.AddMonths(-6); //Recieve Data from the Select Company DropDownList string selectedList = collection["list"]; //Recieve Data from the Select GroupType DropDownList string selectedGroupType = collection["grouptype"]; //Recieve Data from the Show All Stock checkbox string selectedAmount = collection["amount"]; //A list of type  has its value recieved from the function which computes which query to use and then executes it. returnList(selectedGroupType, selectedList, selectedAmount); //Returns the view return View(); } 

在您的Ajax调用中,您传入’data:Json’,mvc操作不包含任何参数,因此它不会找到您尝试请求的操作。 删除此行,它应该工作。

我通过改变我定义DataTable的方式以及定义我的JSON来解决这个问题:

 [AcceptVerbs(HttpVerbs.Get | HttpVerbs.Post)] public JsonResult getAJAX() { using (TableEntities context = new TableEntities()) { stock = (from c in context.stocks select new stockAJAX { StockId = c.StockId, ProductGroup = c.ProductGroup, GroupType = c.GroupType, ItemType = c.ItemType, Model = c.Model, SerialNo = c.SerialNo, NR = c.NR, Status = c.Status.ToString(), Description = c.Description, DateArrived = c.DateArrived.ToString(), CurrentLocation = c.CurrentLocation, TerminalId = c.TerminalId, } ).Take(1000).ToList(); } return Json(new { iTotalRecords = 1000, iTotalDisplayRecords = 10, sEcho = 10, aaData = stock}, JsonRequestBehavior.AllowGet); } 

和我的javascript:

 $("#myTable").DataTable({ "JQueryUI": true, "stateSave": true, "ajax": '/Table/getAJAX', "columns": [ { "data": "StockId" }, { "data": "ProductGroup" }, { "data": "GroupType" }, { "data": "ItemType" }, { "data": "Model" }, { "data": "SerialNo" }, { "data": "NR" }, { "data": "Status" }, { "data": "Description" }, { "data": "DateArrived" }, { "data": "CurrentLocation" }, { "data": "TerminalId" } ], }); 

但是,当我尝试查询整个数据库时,我得到500服务器错误,但如果我查询1000个条目,它工作正常。

 using (TableEntities context = new TableEntities()) { stock = (from c in context.stocks select new stockAJAX { StockId = c.StockId, ProductGroup = c.ProductGroup, GroupType = c.GroupType, ItemType = c.ItemType, Model = c.Model, SerialNo = c.SerialNo, NR = c.NR, Status = c.Status.ToString(), Description = c.Description, DateArrived = c.DateArrived.ToString(), CurrentLocation = c.CurrentLocation, TerminalId = c.TerminalId, } ).ToList(); } 

对于我来说,返回draw=n来自请求参数的正确绘制版本