NavBar中的函数LogOff在MVC5中不起作用

时间:2018-05-15 04:15:59

标签: html css asp.net-mvc bootstrap-4 navbar

在MVC 5中创建了一个项目,我正在实现一个Bootwatch模板,但是我的NavBar菜单中的某些功能不正常。

1.-没有esta funcionando mi boton de" LogOff",al llamar al script de mi _LoginPartial este no se ejecuta y mi boton simplemente no hace nada。

我的_LoginPartial.cshtml:

@using Microsoft.AspNet.Identity
@if (Request.IsAuthenticated)
{
    using (Html.BeginForm("LogOff", "Account", FormMethod.Post, new { id = "logoutForm", @class = "navbar-right" }))
    {
    @Html.AntiForgeryToken()

    <ul class="nav navbar-nav navbar-right">
         <li>
            @Html.ActionLink("Hola: " + User.Identity.GetUserName() + "! ", "Index", "Manage", routeValues: null, htmlAttributes: new { title = "Manage" })
        </li>
        <li><a href="javascript:document.getElementById('logoutForm').submit()">Log off</a></li>
    </ul>
    }
}
else
{
    <ul class="nav navbar-nav navbar-right">
        <li>@Html.ActionLink("Log in", "Login", "Account", routeValues: null, htmlAttributes: new { id = "loginLink" })</li>
    </ul>
}

我的_Layout.cshtml:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title - Muebles Pangal</title>
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")     

     <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>   

</head>
<body>
    <div class="container">
        <nav class="navbar navbar-expand-lg navbar-dark bg-success">
            <a class="navbar-brand" href="#">Muebles Pangal</a>
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarColor01" aria-controls="navbarColor01" aria-expanded="false" aria-label="Toggle navigation" style="">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="navbarColor01">
                <ul class="navbar-nav mr-auto">
                    <li class="nav-item active">
                        <a class="nav-link" href="@Url.Action("Index", "Home")">Home <span class="sr-only">(current)</span></a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="@Url.Action("Index", "Categorias")">Categorias </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="@Url.Action("Index", "Productoes")">Productos </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="@Url.Action("Index", "Ubicacions")">Proveedores </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="@Url.Action("Index", "Usuarios")">Usuarios </a>
                    </li>
                </ul>
                <form class="form-inline my-2 my-lg-0">
                    @Html.Partial("_LoginPartial")    

                </form>

            </div>
        </nav>
        <br />
        </div>

        <div class="container body-content">
            @RenderBody()
            <hr />
            <footer>
                <p>&copy; @DateTime.Now.Year - Sistema Bodega</p>
            </footer>
        </div>

    <script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-2.2.0.min.js"></script>


        @Scripts.Render("~/bundles/jquery")
        @Scripts.Render("~/bundles/bootstrap")
        @RenderSection("scripts", required: false)
</body>
</html>

我的AccountController.cs:

[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult LogOff()
{
    AuthenticationManager.SignOut(DefaultAuthenticationTypes.ApplicationCookie);
    return RedirectToAction("Index", "Home");
}

2.-我的NavBar右侧的颜色与左侧的元素不相等,当我检查我的控制台时,我向a{}扔了一个元素,它会改变颜色,做出改变在其他元素中,例如@Html.ActionLink而不在您要修改的元素中。

这真的是我想要改变颜色的NavBar的元素吗?

Console

这是我第二次使用MVC 5,这是我第一次实施模板,有没有人知道发生了什么? ? 对我有什么帮助吗?

1 个答案:

答案 0 :(得分:2)

ASP.NET无法呈现嵌套表单。仅呈现父表单以便在“部分页面”中保留表单

替换

<form class="form-inline my-2 my-lg-0">
@Html.Partial("My_LoginPartial")
</form>

@using Microsoft.AspNet.Identity

    @if (Request.IsAuthenticated)
        {


            using (Html.BeginForm("LogOff", "Account", FormMethod.Post, new { id = "logoutForm", @class = "navbar-right form-inline my-2 my-lg-0" }))
            {
            @Html.AntiForgeryToken()

            <ul class="nav navbar-nav navbar-right">
                 <li>
                    @Html.ActionLink("Hola: " + User.Identity.GetUserName() + "! ", "Index", "Manage", routeValues: null, htmlAttributes: new { title = "Manage" })
                </li>
                <li><a href="javascript:document.getElementById('logoutForm').submit()">Log off</a></li>
            </ul>
            }
        }
        else
        {
        <form class ="form-inline my-2 my-lg-0"
            <ul class="nav navbar-nav navbar-right">
                <li>@Html.ActionLink("Log in", "Login", "Account", routeValues: null, htmlAttributes: new { id = "loginLink" })</li>
            </ul>
        </form>
        }