Question

我有_LayoutOnecs.html文件，并在其中查看加载，并在表格中显示记录列表。在一个表列中，我点击它时有一个删除图标进入控制器，一旦删除记录就从数据库中删除记录，应该刷新视图，所以我将操作返回给控制器，取出所有记录

public ActionResult GetAdvertisementDetails()
{
    var advertisementList = new AdvertisementManager().GetAdvertisementDetails();     
    return View("AdvertisementDetails", advertisementList);
}

public ActionResult DeleteAdvertisementDetails(int id)
{
    new AdvertisementManager().DeleteAdvertisementDetails(id);
    return RedirectToAction("GetAdvertisementDetails", "Advertisement");
}

一旦完成删除，它将进入GetAdvertisementcontroller并返回视图，但如果我按F5刷新页面，则表中将删除记录。如何在删除记录时自动刷新

查看代码

<div class="col-md-12 main_table">
    <div class="table-responsive">
        <table class="table" id="hom_table">
            <tr>
                <th>Advertisement  Name</th>
                 <th>Link</th>
                 <th>Start Date</th>
                 <th>End Date</th>
                 <th width="100">Action</th>
             </tr>
             @foreach (var advertisements in Model)
             {
                 <tr>
                     <td> @advertisements.Description</td>
                     <td> @advertisements.ImageUrl</td>
                     <td> @advertisements.StartDate</td>
                     <td> @advertisements.EndDate</td>
                     <td>
                         <a onclick="EditadvertisementDetails(@advertisements.AdvertisementId)">
                            <i class=" pull_Advt_details tbl_edit_btn fa fa-edit Editbutton"></i>
                         </a>
                         <a id="Deladvertisement" onclick="Deleteadvertisement(@advertisements.AdvertisementId)" >
                             <i class="tbl_del_btn fa fa-trash"></i>
                         </a>
                     </td>
                 </tr>
             }
         </table>
     </div>
     <!-- Responsive main table Ends -->
</div>

Answer 1

Ajax调用保持在同一页面上。您在控制器方法中使用return RedirectToAction("GetAdvertisementDetails", "Advertisement");将被忽略。它也没有必要重定向，因为你可以从表中删除行

将html修改为（注意删除生成无效html的id属性）：

<a class="delete" data-id="@advertisements.AdvertisementId>
  <i class="tbl_del_btn fa fa-trash"></i>
</a>

并使用以下脚本调用控制器方法并删除行

var url = '@Url.Action("DeleteAdvertisementDetails", "Advertisement")';
$('.delete').click(function() {
  var row = $(this).closest('tr');
  $.post(url, { id: $(this).data('id') }, function(response) {
    if(response) {
      row.remove();
    }
  }).fail(function (response) {
    // display error message?
  });
});

并将控制器修改为

[HttpPost]
public JsonResult DeleteAdvertisementDetails(int id)
{
    new AdvertisementManager().DeleteAdvertisementDetails(id);
    return Json(true);
}

如何刷新MVC中的视图

1 个答案: