我有一个模式的问题,创建一个新条目后,我的表列表不显示表中最后创建的行(在我的数据库中它已存在),它只在我刷新页面后才显示。在Asp.Net中使用Ajax刷新表列表Mvc
我尝试了一些,但只在第一次工作(从: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>
我真的不知道这是怎样的模态的工作,这是我第一次使用他们,所以,如果你能帮助我,我真的它并欣赏。谢谢。
我用另一种方法,它的工作。欲了解更多信息,请参阅此链接:“http://stackoverflow.com/questions/43230009/refresh-table-using-ajax-in-asp-net-mvc” –