采用快捷方式
通过这个我也是该去学习MVC了
直接替换index.htmlcs
@{
//不包含模板
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index1</title>
</head>
<body>
<div>
<p>
<lable>学生学号:</lable>
<input type="text" id="stuID">
</p>
<p>
<lable>教师编号:</lable>
<input type="text" id="teaID">
</p>
<p>
<lable>填报时间:</lable>
<input type="date" id="fillTime">
</p>
<p>
<lable>是否发烧:</lable>
<input type="text" id="isCough">
</p>
<p>
<lable>是否咳嗽:</lable>
<input type="text" id="isFever">
</p>
<input type="button" value="提交" id="send">
<br>
<br>
<table border="1" id="tableID">
<thead>
@*表格头部*@
<tr>
<td>学号</td>
<td>教师编号</td>
<td>填报时间</td>
<td>是否咳嗽</td>
<td>是否发烧</td>
</tr>
</thead>
<tbody>
@*内容*@
</tbody>
</table>
</div>
</body>
</html>
<script src="~/Scripts/jquery-3.4.1.js"></script>
<script>
$("#send").click(function () {
var tbDetails = {
stuID: $("#stuID").val(),
teaID: $("#teaID").val(),
fillTime: $("#fillTime").val(),
isCough: $("#isCough").val(),
isFever: $("#isFever").val()
};
$.ajax({
url: "/api/tbDetails",
method: "post",
dataType: "json",
data: JSON.stringify(tbDetails),
contentType: "application/json;charset=utf-8",
success: function (res) {
console.log(res);
LoadData();
alert("添加成功!");
}
})
});
function LoadData() {
$.ajax({
url: "/api/tbDetails",
method: "get",
dataType: "json",
success: function (res) {
console.log(res);
var $tbody = $("#tableID tbody").empty();
$.each(res, function (index, value) {
var $tr = $("<tr></tr>")
$("<td>" + value.stuID + "</td>").appendTo($tr)
$("<td>" + value.teaID + "</td>").appendTo($tr)
$("<td>" + value.fillTime + "</td>").appendTo($tr)
$("<td>" + value.isCough + "</td>").appendTo($tr)
$("<td>" + value.isFever + "</td>").appendTo($tr)
$tr.appendTo($tbody);
});
},
//error:
});
};
LoadData();
</script>