Automatically collapse the side bar on click. #34

Author: sjefvanleeuwen

src/Blazor.AdminLte/NavBar/NavBarMenuItem.razor.cs

@@ -1,11 +1,16 @@
 using Microsoft.AspNetCore.Components;
 using Microsoft.AspNetCore.Components.Web;
+using Microsoft.JSInterop;
+using Microsoft.JSInterop.Implementation;
 using System;
+using System.Dynamic;
 
 namespace Blazor.AdminLte
 {
  public partial class NavBarMenuItem : INavBarMenuItem
  {
+ [Inject]
+ public Microsoft.JSInterop.IJSRuntime JS { get; set; }
  [Parameter]
  public string Link { get; set; } = "";
  [Parameter]

src/Blazor.AdminLte/SideBar/SideBarMenuItem.razor

@@ -2,6 +2,7 @@
 @inject NavigationManager nav;
 @implements IDisposable
 @inherits BlazorState.BlazorStateComponent
+@inject IJSRuntime JS;
 <li class="nav-item">
  <a href="@Link" class="nav-link @(State.GetState(Id).GetDescription<StyleAttribute>())" @onclick="Click" @onclick:preventDefault>
  <i class="nav-icon @Icon"></i>
@@ -24,6 +25,7 @@
  private void Click()
  {
  nav.NavigateTo(Link);
+ JS.InvokeVoidAsync("toggleAside");
  }
 
  protected override void OnInitialized()

src/Blazor.AdminLte/wwwroot/js/interop.js

@@ -29,7 +29,11 @@ function deactivateSideMenu() {
  $('aside').find("li").each(function () { $(this).find("a").removeClass("active") });
 }
 
-
+function toggleAside() {
+ $('#sidebar-overlay').click();
+ //console.log("hi");
+ //$('aside').slideToggle();
+}
 
 function addClass(el, _class) {
  $(el).addClass(_class);