Question

新手开发者在这里，这实际上是我关于堆栈溢出的第一个问题。我是第一个担任开发人员的角色，我已经完成了完成其他人启动的应用程序的任务，当用户点击某个特定按钮时，我很难让页面刷新。

该页面包含一个项目列表，每个项目旁边都有一个复选框，用户可以勾选复选标记，然后单击“删除项目”按钮。理论上，单击该按钮应该在页面完成后刷新页面，或者至少刷新包含列表的页面部分......据我所知。并且项目正在被删除，但刷新不起作用，因此用户必须在他们选择删除的项目实际上从屏幕上消失之前手动刷新页面。

这是控制器中按钮背后的内容：

[HttpPost]
        public ActionResult UpdatePartStatus(List<tblPart> parts, tblArea area)
        {
            _LookupService.UpdatePartStatus(parts);
            // return RedirectToAction("Details", area);
            // return Redirect("~/Details");
            return RedirectToAction("Parts", "Menu", false);
            // <% return Response.Redirect(Request.RawUrl); %>
            // return Response.Redirect(Request.RawUrl);
            // return Page.Redirect(Page.Request.RawUrl, false);
            // return Redirect(Request.UrlReferrer.ToString());
            // return View();
            // return Redirect(HttpContext.Request.UrlReferrer.AbsoluteUri);

        }

注释掉的第一行是前一位开发人员离开的方式。所有其他被注释掉的行都是我到目前为止所尝试过的，但没有一行有效。而没有注释掉的那个恰好是我在发布之前尝试过的最后一个。大多数尝试都是在堆栈溢出

上搜索的结果

这是详情视图中的脚本：

<script>
    $('#btnAjax').click(function () {

            ....validation code I removed for this post....

            $.ajax({
                type: 'post',
                url: '/Parts/UpdatePartStatus',
                contentType: 'application/json; charset=utf-8',
                data: JSON.stringify(data),
                dataType: 'json'
            })
        }
    });
</script>

以下是我在其他几篇文章中引用的MapRoute代码：

routes.MapRoute(
                name: "Default",
                url: "{controller}/{action}/{id}",
                defaults: new { controller = "Parts", action = "Menu", id = UrlParameter.Optional }

之前的开发人员在他们离开之前说的最后一件事是，这是所有标准的MVC，没有什么不同寻常的，但我的想法已经不多了。

我感谢任何人提出的任何想法或建议。

由于

Answer 1

只需在ajax请求中添加success函数：

$.ajax({
    type: 'post',
    url: '/Parts/UpdatePartStatus',
    contentType: 'application/json; charset=utf-8',
    data: JSON.stringify(data),
    dataType: 'json',
    success: function() {
        location.reload();
    }
})

Answer 2

您共享的代码没有任何内容可以重新加载当前页面。看起来你正在向服务器提交一个ajax表单。因此，从那里返回重定向响应并没有多大意义。

如果您想重新加载页面，可以在ajax调用的done事件中执行此操作。

$.ajax({
    type: 'post',
    url: '/Parts/UpdatePartStatus',
    contentType: 'application/json; charset=utf-8',
    data: JSON.stringify(data)
}).done(function(res){
    window.location.href = window.location.href; // This will reload the page
}).fail(function(a, b, c) {
    console.log('ajax call failed');
    });

但是再次，如果你正在重新加载页面，那么做ajax帖子的重点是什么？您可以简单地删除使用javascript删除的特定DOM元素，而不是对页面进行实际编码。这将为用户提供部分页面更新体验，而无需重新加载整个页面。

如果你知道你删除的项目的ID，你可以在jQuery选择器中使用它删除它。

var idOfDeletedItem = "someDomElementId";
$.ajax({
    type: 'post',
    url: '/Parts/UpdatePartStatus',
    contentType: 'application/json; charset=utf-8',
    data: JSON.stringify(data)
}).done(function(res){
    // Let's remove that DOM element from the DOM
    $("#"+idOfDeletedItem).remove();

}).fail(function(a, b, c) {
    console.log('ajax call failed');
});

Answer 3

如果您使用的是Ajax，那么您应该使用

    public JsonResult UpdatePartStatus(List<tblPart> parts, tblArea area)
    {
        _LookupService.UpdatePartStatus(parts);

        return Json(null); //This will always return a null result to your ajax call indicating a success 
    }

对我来说，我通常会以这种方式返回json结果：

try {
    LookupService.UpdatePartStatus(parts);
    return Json(new { Success = true});
}
catch {
    return Json(new { Success = false});
}

在你的ajax电话中，做到这一点：

$.ajax({
type: 'post',
url: '/Parts/UpdatePartStatus',
contentType: 'application/json; charset=utf-8',
data: JSON.stringify(data),
dataType: 'json',
success: function(result) {
    if (result.Success)
        location.reload();
    } else {
        alert("Delete failed");
    }

}
})

按下按钮刷新页面

3 个答案: