Template for Blazor


Topic: Template for Blazor

Bucher asked 3 years ago

Hello,

I tried to convert your integration admin template for .NET and ASP.NET MVC to Blazor,but the sidebar isn't working.

Can you provide me a ready to use sample for Blazor Server Side?

Regards, Barnabas Bücher


Grzegorz Bujański staff commented 3 years ago

Unfortunately for .net we only have this one integration. Blazor integrations should be done on your own. What exactly doesn't work for you. Have you got a bug in your console? Sidenav is visible on the site? Adds correctly to the DOM?


Bucher commented 3 years ago

Hello,

I just tried to use your .net Template in Blazor Server Side.

So I started with a Blank App and insert the parts from the .NET Template.

The sidebar isn't hide if the Window get smaller.

Also the hamburger menu doesn't appear if the size gets smaller.

Regards, Barnabas Bücher


Grzegorz Bujański staff answered 3 years ago

Sorry, but we don't download files from sources unknown to us for security reasons. Sidenav does not hide by default after resizing the window. You have to handle it yourself.

const sidenavInstance = mdb.Sidenav.getInstance(document.getElementById('sidenav'));
window.addEventListener('resize', sidenavInstance.hide());

Bucher commented 3 years ago

Hello,

the problem is that the function mdb.Sidenav.getInstance(sidenav)returns null:

const sidenav = document.getElementById("sidenav-1");const instanceSide = mdb.Sidenav.getInstance(sidenav); //null


Grzegorz Bujański staff answered 3 years ago

This is because sidenav has not been initialized. Just add a condition that will check it:

let sidenavInstance = mdb.Sidenav.getInstance(document.getElementById('sidenav'));

if (!sidenavInstance) {
  sidenavInstance = new mdb.Sidenav(document.getElementById('sidenav'));
}

window.addEventListener('resize', sidenavInstance.hide());

Bucher commented 3 years ago

Hello,

thank you for your help, it's working now with Server Side Blazor.

Regards, Barnabas Bücher


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: MDB Standard
  • MDB Version: MDB5 3.9.0
  • Device: Windows
  • Browser: Edge
  • OS: Windows
  • Provided sample code: No
  • Provided link: No
Tags