使用asp.net在adminlte中注销样式答案

【问题标题】：Sign-out Styling in adminlte using asp.net使用asp.net在adminlte中注销样式
【发布时间】：2020-12-03 20:23:41
【问题描述】：

我在仪表板中使用了相当出色的admintlte，但是我对注销的样式有一点问题，因为它必须是 asp.net core mvc 中的一个表单。

关于如何使用锚标签的任何想法我尝试使用 asp-controller 的标签，但它没有正确注销我，它只是把我带到了我的主页。

它应该看起来更像是设置链接，周围没有按钮影响。

我目前正在使用以下代码

<div class="dropdown-menu dropdown-menu-lg dropdown-menu-right">
  <div class="dropdown-divider"></div>
   <a asp-action="Setup" asp-controller="Admin" asp-route-id="1" class="dropdown-item">
        <i class="fas fa-user mr-2"></i> Setups</a>
  
    <div class="dropdown-divider"></div>


    @if (User.Identity.IsAuthenticated) {
        <a href="#" class="dropdown-item">

    
            <form asp-controller="Account" asp-action="Logout" method="post" id="logoutForm">
                <i class="fas fa fa-sign-in-alt mr-2"></i>
                <button type="submit" class="nav-link">Sign out</button>
            </form>
            </a>
    } else {
        <a asp-area="Identity" asp-page="/Account/Login" class="dropdown-item dropdown-footer fa fa-sign-in-alt">Login</a>
        <a asp-area="Identity" asp-page="/Account/Register" class="dropdown-item dropdown-footer">Register</a>

    }

</div>

目前看起来是这样的。

【问题讨论】：

标签： css asp.net-core model-view-controller razor bootstrap-4

【解决方案1】：

你把表单设置为隐藏状态，然后在锚标签上执行 JavaScript 来模拟表单提交。

<form class="d-none" method="post" id="logoutForm
  asp-controller="Account" asp-action="Logout"">
</form>
<a href="javascript:document.getElementById('#logoutForm').submit()" 
  class="dropdown-item">
    <i class="fas fa fa-sign-in-alt mr-2"></i>
    Sign Out
</a>

【讨论】：

感谢伙计。 Admintlte 很棒，他们已经用过几次了，只是我一直忘记的那个。
是的，我通常在 .NET Core 项目中制作自己的主题，这个 sn-p 很方便。
我一直想建立和使用我的 sn-ps，但我从来没有想过可能有一个我没有充分利用的功能，因为他们担心重新安装时会失去所有功能
它仍然没有内联它我们有点接近边缘的一些原因
抱歉，我输入了 dropdown-menu-item 而不是 dropdown-item。我刚刚修好了。

【解决方案2】：

我实际上想出了一种不同的方法

@if (User.Identity.IsAuthenticated) {
    <a href="#" class="dropdown-item">


        <form asp-controller="Account" asp-action="Logout" method="post" id="logoutForm">
            <i class="fas fa fa-sign-in-alt mr-2"></i>
            <button type="submit"  class="link">Sign out</button>
        </form>
    </a>

  } else {
    <a asp-area="Identity" asp-page="/Account/Login" class="dropdown-item dropdown-footer fa fa-sign-in-alt">Login</a>
    <a asp-area="Identity" asp-page="/Account/Register" class="dropdown-item dropdown-footer">Register</a>

 }

</div>

然后在我的 css 中我只有以下内容

button.link {
 background: none !important;
 border: none;
 padding: 0 !important;
 /*optional*/
 font-family: arial, sans-serif;
 /*input has OS specific font-family*/
 color: black;
 text-decoration: none;
 cursor: pointer;
}

【讨论】：