ASP.NET MVC 4 Default _LoginPartial template Logout not working

Question

I have been fiddling around with the _Layout and _PartialLayouts of the default MVC 4 templates and suddenly the 'Logout' feature in the '_PartialLogin' doc has stopeed working. To give you more info, the _LoginPartial.cshtml is called from the _NavBar.cshtml which in turn is called from the _Layout.cshtml

The code of the _LoginPartial.cshtml is:

@if (Request.IsAuthenticated) {
<text>
    <p>Hello, @Html.ActionLink(User.Identity.Name, "Manage", "Account", routeValues: null, htmlAttributes: new { @class = "username", title = "Manage" })!
    @using (Html.BeginForm("LogOff", "Account", FormMethod.Post, new { id = "logoutForm" })) {
        @Html.AntiForgeryToken()
        <a href="javascript:document.getElementById('logoutForm').submit()">Log off</a>
    }</p>
</text>
}

The code from the _NavBar.cshtml is:

<form class ="navbar-form navbar-right" method="post" action="/account/login">
    <div class ="form-group">
        @Html.Partial("_LoginPartial")
    </div>
</form>

The code from the _Layout.cshtml is:

<body>
    @Html.Partial("_Navbar")
    @RenderSection("featured", required: false)
    @RenderBody()
    <div class="container">

I get that maybe the problem is the javascript has been disabled unintentionally somehow. Am I missing some script tags maybe? Or is it something in the previous class where I called the _PartialLogin from??

Is there still a form with the id `logoutForm` which executes a post to a logout action on the page? — Henk Mollema, Dec 03 '13 at 10:57
Yes. I have only changed some of the lines in the '_Layout' form and the '_PartialLogin' form — Gman16, Dec 03 '13 at 14:58
Can you show (at least the relevant parts) the layout file? Also, what error are you receiving? — Henk Mollema, Dec 04 '13 at 19:58
@HenkMollema There is no error, it just has no response when I click the Logout link - Although I even changed it to `@Html.ActionLink("Log off", "LogOff", "Account", routeValues: null, htmlAttributes: new { @class = "btn btn-warning" })` and the redirect does not work. Is it because I am calling the _LoginPartial.cshtml in the _NavBar.cshtml which is being called from the _Layout.cshtml? — Gman16, Dec 05 '13 at 07:56
rant: Microsoft should **really stop using crappy code**. What's wrong with a ` — Bart Calixto, Jul 15 '14 at 04:51

score 3 · Answer 1 · answered Jul 15 '14 at 04:53

I'm not answering your question ( you already solved the problem ) but I think this greatly improves the code:

change this line :

<a href="javascript:document.getElementById('logoutForm').submit()">Log off</a>

with this one:

<button class="btn btn-link">Log off</button>

also the id on the form is not needed with this change.

score 2 · Answer 2 · edited May 23 '17 at 12:17

I had this problem too - because we are also using bootstrap.

This worked fine in Chrome:

<a href="javascript:document.getElementById('logoutForm').submit()">Log off</a>

But to get it working on Explorer, the solution was to move the javascript to the onclick attribute:

<a href="#" onclick="javascript:document.getElementById('logoutForm').submit()">Log off</a>

https://stackoverflow.com/a/17078223

score 1 · Answer 3 · answered Dec 05 '13 at 13:24

Solved the problem...

You cannot put the javascript text in a <form> tag. It will not work as the bootstrap messes with it then.

It doesnt matter how many times you call the partialLayouts within eachother - just be careful which tags you embed the javascript in

ASP.NET MVC 4 Default _LoginPartial template Logout not working

3 Answers3

Linked