我想创建一个像(https://datatables.net/)的表,然后我在文件中调用了css和js文件。但是不知何故我无法显示表格。
链接显示在下面的代码中。
@{
ViewBag.Title = "Emplpoyee list";
}
<h2>Employee CRUD Operations</h2>
<table id="employeeTable" class="display">
<thead>
<tr>
<th>Name</th>
<th>Position</th>
<th>Office</th>
<th>Age</th>
<th>Salary</th>
</tr>
</thead>
</table>
<link href="//cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet" type="text/css"/>
@section scripts{
<script type="text/javascript" charset="utf8" src="//cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<script>
$(document).ready(function () {
$("#employeeTable").DataTable({
"ajax": {
"url": "/Employee/GetData",
"type": "GET",
"datatype":"json"
},
"columns": [
{ "data": "Name" }
{ "data": "Position" }
{ "data": "Office" }
{ "data": "Age" }
{ "data": "Salary" }
]
});
});
</script>
}
答案 0 :(得分:0)
可能是问题出在您的Ajax类型中。 试试:
$('#myTable').DataTable( {
ajax: {
url: '/api/myData',
dataSrc: 'data'
},
columns: [ ... ]
} );
相反:
$(document).ready(function () {
$("#employeeTable").DataTable({
"ajax": {
"url": "/Employee/GetData",
"type": "GET",
"datatype":"json"
},
"columns": [
{ "data": "Name" }
{ "data": "Position" }
{ "data": "Office" }
{ "data": "Age" }
{ "data": "Salary" }
]
});
});
或者:
$('#myTable').DataTable( {
ajax: ...,
columns: [
{ data: 'name' },
{ data: 'position' },
{ data: 'salary' },
{ data: 'state_date' },
{ data: 'office' },
{ data: 'extn' }
]
} );