MVC RedirectToAction 通过 ajax jQuery 在knockoutjs 中调用不起作用 [英] MVC RedirectToAction through ajax jQuery call in knockoutjs is not working

问题描述

我正在构建一个 MVC3 Web 应用程序并且我正在使用 Knockoutjs.应用程序中有两个视图.设置新公司和管理帐户.要建立新公司，用户首先输入帐号并单击搜索.如果帐号已经存在，用户可以单击按钮转到 ManageAccount 视图.在 SetUpNewCompanyController 中，我使用 RedirectToAction 方法重定向.但是，当执行 ManageAccount 中的 Index2 操作时，不会显示该视图.如果我输入完整的 URL，就会显示视图.

I am building a MVC3 web application and I am using knockoutjs. There are two views in the application. SetUpNewCompany and ManageAccount. To Set up a new company the user first enters the account number and clicks search. If the account number already exists the user can click on a button to go to the ManageAccount view. In the SetUpNewCompanyController I redirect using the RedirectToAction method. However, when the Index2 action in ManageAccount is executed the view is not displayed. If I type in the complete URL the view is displayed.

SetUpNewCompanyController.cs

SetUpNewCompanyController.cs

[HttpPost]
 public RedirectToRouteResult RedirectToManageAccount(string accountNumber)
 {
        return RedirectToAction("Index2", new RouteValueDictionary(new {controller=
            "ManageAccount", companyId = "7e96b930-a786-44dd-8576-052ce608e38f" }));
 }

当点击按钮时，下面的函数会调用上面的这个

This above is called by the function below when a button is clicked

self.redirectToManageAccount = function () {
        var accountNumber = "7e96b930-a786-44dd-8576-052ce608e38f";
        $.ajax({
            type: "POST",
            url: "/SetUpNewCompany/RedirectToManageAccount",
            data: { accountNumber: accountNumber },
            success: function (data) {
            },
            error: function () {
            }
        });
 }

ManageAccountController.cs

ManageAccountController.cs

public ActionResult Index2(String companyId)
    {
        var viewModel = new Models.Index();

        List<String> compList = new List<String>();
        compList.Add("MyCompany");

        List<String> usersList = new List<String>();
        usersList.Add("User1");

        viewModel.Users = usersList;
        viewModel.Companies = compList;
        viewModel.CompanyId = companyId;
        viewModel.Role = "Role1";

        return View("ManageAccount",viewModel);
    }

生成的网址是

http://localhost:53897/ManageAccount/Index2?companyId=7e96b930-a786-44dd-8576-
052ce608e38f

Firebug 中的控制台窗口显示

The console window in Firebug shows

GET http://localhost:53897/ManageAccount/Index2?companyId=7e96b930-a786-44dd-8576-
052ce608e38f 200 OK and the spinner keeps spinng

另外，如何获取下面的 URL 而不是带有查询字符串的 URL

Also, how do I get the URL below instead of the one with querystring

http://localhost:53897/ManageAccount/Index2/7e96b930-a786-44dd-8576-052ce608e38f

推荐答案

由于您使用 AJAX 调用 RedirectToManageAccount 操作方法，因此您有责任自己处理它的响应并作为您的 成功 处理函数为空，您实际上忽略了作为响应到达的任何内容.

Since you use AJAX to call the RedirectToManageAccount action method, you are responsible for handling its response yourself and as your success handler function is empty, you are effectively ignoring whatever arrives as a response.

如果您想从 AJAX 响应处理程序中强制重定向，我建议

If you want to force a redirect from within the AJAX response handler, I suggest

1. 修改你的操作方法如下

1. Modifying your action method as follows

[HttpPost]
public ActionResult RedirectToManageAccount(string accountNumber)
{
    var redirectUrl = new UrlHelper(Request.RequestContext).Action("Index2", "ManageAccount", new { companyId = "7e96b930-a786-44dd-8576-052ce608e38f" });
    return Json(new { Url = redirectUrl });
}

以这种方式更新您的 AJAX 调用

Updating your AJAX call in this way

self.redirectToManageAccount = function () {
  var accountNumber = "7e96b930-a786-44dd-8576-052ce608e38f";
  $.ajax({ type: "POST",
           url: "/SetUpNewCompany/RedirectToManageAccount",
           data: { accountNumber: accountNumber },
           dataType: 'json',
           success: function (response) {
               window.location.href = response.Url;
           },
           error: function () {
           }
  });
}

至于你的第二个问题:

另外，如何获取下面的 URL 而不是带有查询字符串的 URLhttp://localhost:53897/ManageAccount/Index2/7e96b930-a786-44dd-8576-052ce608e38f

Also, how do I get the URL below instead of the one with querystring http://localhost:53897/ManageAccount/Index2/7e96b930-a786-44dd-8576-052ce608e38f

您只需在 RegisterRoutes() 函数中为此 URL 定义适当的路由条目:

You just have to define an appropriate route entry for this URL in your RegisterRoutes() function:

routes.MapRoute(null,
                "ManageAccount/Index2/{companyId}",
                new { controller = "ManageAccount",
                      action = "Index2" }                            
);

<小时>

EDIT:由于您的 AJAX 调用仅用于调用导致重定向的操作方法，您可以通过以下方式对其进行简化，前提是您在这一点上(在客户端)知道companyId 已经:

---

EDIT: As your AJAX call only serves to call an action method which causes a redirect, you can simplify it in a following way, provided you in this point (on the client side) know the companyId already:

self.redirectToManageAccount = function () {
    var companyId = "12345";
    window.location.href = '@(Html.ActionUri("Index2", "ManageAccount"))?companyId=' + companyId;
}

我在哪里使用这种扩展方法

where I used this extension method

public static string ActionUri(this HtmlHelper html, string action, string controller)
{
    return new UrlHelper(html.ViewContext.RequestContext).Action(action, controller);
}

这篇关于MVC RedirectToAction 通过 ajax jQuery 在knockoutjs 中调用不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！