ShadyNagy.Blazor.JavaScriptUtilities 1.0.6

Blazor.JavaScriptUtilities

Utilities by JavaScript for Blazor

• Local Storage Available to check browser support local storage

• Local Storage Set

• Local Storage Read

• Local Storage Remove by key

• Local Storage Read All without keys

• Local Storage Remove All

• Local Storage Count

• Local Storage Listener for changes

• Scroll Hide

• Scroll Show

• Cookie Read

• Cookie Delete

...... and more coming.

Give a Star!

If you like or are using this project please give it a star. Thanks!

Getting Setup

You can install the package via the nuget package manager just search for ShadyNagy.Blazor.. You can also install via powershell using the following command.

Install-Package ShadyNagy.Blazor.JavaScriptUtilities

Or via the dotnet CLI.

dotnet add package ShadyNagy.Blazor.JavaScriptUtilities

1. Register Services

For Blazor WebAssembly: You will need to add the following using statement and add a call to register the Blazor JavaScript Utilities services in your applications Program.Main method.

using ShadyNagy.Blazor.JavaScriptUtilities;

public static async Task Main(string[] args)
{
    builder.Services.AddAllBlazorJavaScriptUtilities();
}

Also you can register what you need only ex

builder.Services.AddBlazorScrollController();

For Blazor Server: You will need to add the following using statement and add a call to register the Blazor JavaScript Utilities services in your applications Startup.ConfigureServices method.

using ShadyNagy.Blazor.JavaScriptUtilities;

public void ConfigureServices(IServiceCollection services)
{
    services.AddAllBlazorJavaScriptUtilities();
}

Also you can register what you need only ex

services.AddBlazorScrollController();

2. Add reference to style sheet & javascript reference

Add the following line to the head tag of your _Host.cshtml (Blazor Server) or index.html (Blazor WebAssembly).

<link rel="stylesheet" href="_content/ShadyNagy.Blazor.JavaScriptUtilities/blazor-javascript-utilities.min.css" />

Then add a reference to the Blazor Utilities JavaScript file at the bottom of the respective page after the reference to the Blazor file before </body>.

<script src="_content/ShadyNagy.Blazor.JavaScriptUtilities/blazor-javascript-utilities-min.js" type="text/javascript" language="javascript"></script>

3. Add Imports

Add the following to your _Imports.razor

@using ShadyNagy.Blazor.JavaScriptUtilities
@using ShadyNagy.Blazor.JavaScriptUtilities.Services
@using ShadyNagy.Blazor.JavaScriptUtilities.Constants

4. Add Injects

@inject IBlazorScrollController BlazorScrollController
@inject IBlazorCookie BlazorCookie

5. Examples

To hide both scrolls

await BlazorScrollController.HideBodyScrollOverflowAsync(ScrollType.Both);

Usage

Please checkout the sample projects in this repo to see working examples of the features in the Blazor JavaScript Utilities.