我的模式有问题，在创建新条目后，我的表列表没有显示表中最后创建的行（在我的数据库中它已经存在），它仅在刷新页面后才显示。
我尝试了一些东西，但只第一次起作用（来自：在 ASP.NET MVC 中使用 AJAX 刷新表 https://stackoverflow.com/questions/38635966/refresh-table-using-ajax-in-asp-net-mvc).
这是我的控制器代码：
public ActionResult IndexEvent()
{
return View(db.tbl_Event.ToList());
}
[HttpGet]
public ActionResult Add()
{
return View();
}
[HttpPost]
public ActionResult Add(BOL3.tbl_Event eve)
{
if(ModelState.IsValid)
{
db.tbl_Event.Add(eve);
db.SaveChanges();
}
return IndexEvent();
}
，这是操作按钮和模式：
<button type="button" class="btn btn-info btn-xs" data-toggle="modal" data-target="#enquirypopup">Add</button>
<div id="enquirypopup" class="modal fade in" role="dialog" tabindex="-1">
<div class="modal-dialog">
<div class="modal-content row">
<div class="modal-header custom-modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Add Event</h4>
</div>
<div class="modal-body">
<form id="myForm">
<div class="modal-body">
<div class="row form-group">
<div class="col-md-12">
<div class="input-group">
<span class="input-group-addon"></span>
<input type="text" class="form-control" name="Event" id="Event" placeholder="Event Name">
</div>
</div>
</div>
<div class="row form-group">
<div class="col-md-12">
<div class="input-group">
<span class="input-group-addon"></span>
<input type="text" class="form-control" name="Start_Date" id="Start_Date">
</div>
</div>
</div>
<div class="row form-group">
<div class="col-md-12">
<div class="input-group">
<span class="input-group-addon"></span>
<input type="text" class="form-control" name="End_Date" id="End_Date">
</div>
</div>
</div>
<br />
<div class="modal-footer">
<button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-success" id="btnSubmit">Save</button>
</div>
</form>
</div>
</div>
</div>
</div>
这是表格和脚本部分：
<script>
$(document).ready(function () {
$("#btnSubmit").click(function () {
var myformdata = $("#myForm").serialize();
$.ajax({
type: "POST",
url: "/Prog/Add",
data: myformdata,
success: function () {
$("#enquirypopup").modal("hide");
$("#tbl").load("/Prog/IndexEvent");
//$("#tbl").reload("/Prog/IndexEvent");
}
})
})
})
</script>
@model.....
<div class="table-responsive">
<table class="table table-bordered table-striped" id="tbl">
<thead>
<tr>
<th>Event Name</th>
<th>Starting (Date and Time)</th>
<th>Ending (Date and Time)</th>
<th>All Day ?</th>
<th></th>
</tr>
</thead>
<tbody>
@foreach(var item in Model)
{
<tr>
<td>
@Html.DisplayFor(modelItem => item.Event)
</td>
<td>
@Html.DisplayFor(modelItem => item.Start_Date)
</td>
<td>
@Html.DisplayFor(modelItem => item.End_Date)
</td>
<td>
@Html.DisplayFor(modelItem => item.All_Day)
</td>
<td style="align-content:center">
<a href="@Url.Action("EditEvent", "Prog", new { id = item.ID})" class="editDialog">Edit</a> |
@Html.ActionLink("Delete", "Delete", new { id = item.ID })
</td>
</tr>
}
</tbody>
</table>
</div>
我真的不知道这个模式到底是如何工作的，这是我第一次使用它们，所以如果你能帮助我，我真的很感激。谢谢。
简单的！
添加location.reload()成功。
$.ajax({
type: "POST",
url: "/Prog/Add",
data: myformdata,
success: function () {
$("#enquirypopup").modal("hide");
location.reload();
}
});
希望有帮助。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
