为啥我在 ajax post 调用后得到 json 响应页面？

Posted 2023-04-12

【中文标题】为啥我在 ajax post 调用后得到 json 响应页面？

【英文标题】：Why am I getting json response page after ajax post call?为什么我在 ajax post 调用后得到 json 响应页面？

【发布时间】：2020-12-12 17:12:13

【问题描述】：

我有一个 aps.net MVC5 网络应用程序，我有一个看起来像这样的控制器操作发布方法，

   [HttpPost]
        [ValidateAntiForgeryToken]
        public ActionResult Set(int id)
        
            DbHelper dbHelper = new DbHelper();
            dbHelper.Update<News>("update news set ispublished = 1, publishdate = @PublishDate  where newsid = @NewsId", new  NewsId = id, PublishDate = DateTime.Now );
            return Json(new  success = true, message = "added successfully!", redirectToUrl = Url.Action("NewsList", "Home") , JsonRequestBehavior.AllowGet);
        

现在，当我从 View 调用此方法时，

 $(document).on("click", ".set", function () 

        var mId = $(this).attr("data-model-id");
        $.ajax(
            url: "@Url.Action("Set","Home")",
            data:  "id": mId ,
            contentType: 'application/json',
            type: 'POST',
            dataType:'json',
            success: function (response) 
                if (response.success) 
                    window.location.href = response.redirectToUrl;
                    dt.ajax.reload();

                    $.notify(data.message, 
                        globalPosition: "top center",
                        className: "success"
                    );
                
            ,
            error: function (response) 
                $.notify(response.message, 
                    globalPosition: "top center",
                    className: "success"
                );
            
        );
    );

我总是收到这个enter image description here

我希望被重定向到主页/新闻列表网址。我尝试更改 ajax call 的所有参数，添加和删除它们，但无论我做什么，我总是登陆这个页面。

【问题讨论】：

试试window.location.replace(response.redirectToUrl)而不是window.location.href = response.redirectToUrl;

还是一样的，调用一结束，就到了这个页面，成功回调方法也没有触发。我在哪里设置这个值。

有趣！你能放下“窗户”吗？看看会发生什么

error 回调是否正在执行？

您是如何测试“从未调用成功回调”的？ if语句前的'console.log(response)'能成功吗？

【参考方案1】：

从你的 ajax 中删除“错误”功能后尝试检查。你也可以试试这个：

$(document).on("click", ".set", function () 

    var mId = $(this).attr("data-model-id");
    $.ajax(
        url: "@Url.Action("Set","Home")",
        data:  "id": mId ,
        contentType: 'application/json',
        type: 'POST',
        dataType:'json',
        success: function (response) 
            if (response.success) 
                window.location.href = response.redirectToUrl;
                dt.ajax.reload();

                $.notify(data.message, 
                    globalPosition: "top center",
                    className: "success"
                );
            
        ,
        error: function (jqXHR, textStatus, errorThrown) 
            $.notify(errorThrown, 
                globalPosition: "top center",
                className: "success"
            );
        
    );
);

检查成功函数是否正在调用。

【讨论】：

这完全没有区别。

您是否检查过后端方法ActionResult Set(int id) 在ajax 请求后是否被命中？还要确保 html 中的“.set”按钮不能是提交类型。

是的，它被击中了，这就是返回 json 响应的原因

还要确保你的html中的“.set”按钮不能是提交类型。

我更改了按钮类型仍然得到相同的响应。

【参考方案2】：

如果您需要在 ajax 响应中返回完整的 HTML 页面，那么您需要更改控制器方法并进行一些更改。

[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Set(int id)

       DbHelper dbHelper = new DbHelper();
       dbHelper.Update<News>("update news set ispublished = 1, publishdate = @PublishDate  where newsid = @NewsId", new  NewsId = id, PublishDate = DateTime.Now );
       //return Json(new  success = true, message = "added successfully!", redirectToUrl = Url.Action("NewsList", "Home") , JsonRequestBehavior.AllowGet);
       return view("ViewName");

【讨论】：

不会重新加载整个页面吗？

那你需要返回json响应是最好的选择还是局部视图。