使用 Ajax C# 在不同的控制器/动作中调用动作答案

【问题标题】：Call an action inside different Controller/Action using Ajax C#使用 Ajax C# 在不同的控制器/动作中调用动作
【发布时间】：2019-09-17 14:50:54
【问题描述】：

我有 _layout 文件我想在项目的不同页面上显示的内容

_layout.cshtml

<html>
xxxxx
</html>

我的_layout 有一个导航栏我决定创建一个partialView 以便能够使用不同于我的“家”控制器的另一个控制器显示该导航栏

导航控制器

public class NavBarController : Controller
{
    // GET: NavBar
   [ChildActionOnly]
    public PartialViewResult BarraNavegacion()
    {
        return PartialView("~/Views/Shared/_navbar.cshtml");
    }

    [HttpPost]
    public string LogOut(string data)
    {
        FormsAuthentication.SignOut();
        return "bye";
    }
}

在我的_layout 中，我添加了以下行：

@{Html.RenderAction("BarraNavegacion", "NavBar");}

到目前为止一切正常，导航栏显示良好

我的导航栏有一个注销按钮，所以我尝试使用 ajax 实现 LogOut 方法

脚本退出

//Boton salir
    $('.salirUsuario').click(function() {

        console.log("salio");

        $.ajax({
            url: 'LogOut',
            method: "POST",
            data: { data: "xx" },
            async: false,
            dataType: "json",
            success: function (json) {

                window.location.href = '@Url.Action("Login","Login")';
            }
        });

但收到以下控制台错误

jquery-3.4.1.min.js:2 POST http://localhost:9887/Home/LogOut 404 (Not Found)

我知道应用程序试图在“Home”（这是我目前所在的视图）中找到方法/操作“LogOut”，但是我如何转到控制器的 NavBar / LogOut我创建的名为NavBar 而不是转到“Home”或我当时所在的任何其他视图？

【问题讨论】：

我认为你错过了这一点。您的局部视图与您的操作方法以及您如何实现它们无关。只要您的路线定义正确，您就可以使用 AJAX 调用任何控制器的任何操作方法并在那里处理您的逻辑。从技术上讲，您将调用Home 控制器的Logout 方法，并根据您的逻辑，您可以发回注销状态并对View 进行适当的重定向。您还应该阅读此答案以获取更多信息：stackoverflow.com/questions/10253769/…

标签： c# ajax asp.net-mvc

【解决方案1】：

您要发布到的 LogOut 操作在您的 NavBarController 上，但在您当前的 AJAX 函数中，asp.net MVC 框架将尝试在默认控制器路径上查找 LogOut 路由，即您的“ Home”控制器，因为您将 AJAX URL 属性设置为 url: 'LogOut'。您需要更具体地说明 URL 中的路由位置。

对于 Razor 页面 javascript：

您的 AJAX Url 需要包含您的控制器路径，因此如果此 javascript 在 razorpage (.cshtml) 文件中，您可以执行以下操作：

    $.ajax({
        url: '@Url.Content("~/NavBar/LogOut")',
        method: "POST",
        data: { data: "xx" },
        async: false,
        dataType: "json",
        success: function (json) {

            window.location.href = '@Url.Action("Login","Login")';
        }
    });

对于引用的 javascript 文件：

如果您的 javascript 代码位于引用的单独 javascript 文件中，那么您可以在布局页面中为应用程序的基本 URL 路径创建一个变量，然后您可以在任何包含的 javascript 文件中使用该变量，只要您在添加任何 script 标记以引用 javascript 文件之前，在布局页面中声明该变量。

布局页面文件第一个script标签可以是：

<script type="text/javascript">
    var baseApplicationPath = '@Url.Content("~/")';
</script>

如果你的 AJAX 在另一个引用的 javascript 文件中，你可以在需要的地方做这样的事情：

    $.ajax({
        url: baseApplicationPath + 'NavBar/LogOut',
        method: "POST",
        data: { data: "xx" },
        async: false,
        dataType: "json",
        success: function (json) {
            window.location.href = baseApplicationPath + 'Login/Login';
        }
    });

【讨论】：

【解决方案2】：

如果您想为少数视图包含导航栏，可以添加以下行，例如

@Html.Partial("~/Views/Controller/View.cshtml", model)

假设你想在主布局页面中使用它，在_layout.chtml中添加上面的代码，你可以调用下面的代码来渲染主布局

@{
Layout = "~/Views/Shared/_layout.cshtml";
}

而注销只需执行以下脚本

 $('.salirUsuario').click(function() {
      window.location.href = '/NavBar/LogOut';          
 });

【讨论】：