Нажмите здесь: https://dotnetfiddle.net/S7KWOg
Я не получил ошибку с этим:
Просмотр
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index4</title>
@*added this css*@
<style>
body {
padding-left: 50px;
width: 80%;
}
</style>
@*removed the bootstrap for better dataTable styling*@
@*putting all your scripts in the head*@
<link href="//cdn.datatables.net/1.10.20/css/jquery.dataTables.min.css" rel="stylesheet" />
@*<link href="https://cdn.datatables.net/1.10.20/css/dataTables.bootstrap.min.css" rel="stylesheet" />*@
@*added this script*@
<link href="https://cdn.datatables.net/1.10.20/css/jquery.dataTables.min.css" rel="stylesheet" />
@*need this jquery script*@
<script src="https://code.jquery.com/jquery-1.12.4.min.js"
integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ="
crossorigin="anonymous"></script>
<script src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
@*<script src="https://cdn.datatables.net/1.10.20/js/dataTables.bootstrap.min.js"></script>*@
<script>
$(document).ready(function () {
$('#productsTable').DataTable({
"ajax": {
//using home controller instead of products
"url": "/Home/GetData",
//"url": "/Products/GetData",
"type": "GET",
"datatype": "json"
},
"columns": [
{ "data": "Name" },
{ "data": "Code" },
{ "data": "Price" },
{ "data": "Available" }
]
});
});
</script>
</head>
<body>
<table id="productsTable" class="table table-striped table-bordered display">
@*added display class*@
<thead>
<tr>
<th>Name</th>
<th>Code</th>
<th>Price</th>
<th>No of Products</th>
</tr>
</thead>
</table>
@section scripts{
@*moved these scripts to the head*@
}
</body>
</html>
Контроллер / Модель
public class product
{
public int ProductId { get; set; }
public string Name { get; set; }
public string Code { get; set; }
public decimal Price { get; set; }
public Nullable<int> Available { get; set; }
public byte[] is_deleted { get; set; }
}
public class HomeController : Controller
{
public ActionResult GetData()
{
//using (DBModel db = new DBModel())
//{
// List<product> proList = db.products.ToList<product>();
// return Json(new { data = proList }, JsonRequestBehavior.AllowGet);
//}
List<product> proList = new List<product>{ new product { Available = 1, Code = "Code1", is_deleted = new byte[1],
Name = "Name1", Price = 1.27M, ProductId = 1 },
new product { Available = 2, Code = "Code2", is_deleted = new byte[2],
Name = "Name2", Price = 1.28M, ProductId = 2 },
new product { Available = 3, Code = "Code3", is_deleted = new byte[3],
Name = "Name3", Price = 1.29M, ProductId = 3 } };
return Json(new { data = proList }, JsonRequestBehavior.AllowGet);
}
public ActionResult Index4()
{
return View();
}