Blazor UI Components for jQWidgets

Blazor lets you build interactive web UIs using C# instead of JavaScript. Blazor apps are composed of reusable web UI components implemented using C#, HTML, and CSS. Blazor can run your client-side C# code directly in the browser, using WebAssembly. Because it's real .NET running on WebAssembly, you can re-use code and libraries from server-side parts of your application.

Prerequisites

.NET Core SDK - This includes everything you need to build and run Blazor WebAssembly apps.

Setup

I. Create a blazor application:

dotnet new blazorwasm -o jqwidgets-blazor-app

II. Navigate to the application:

cd jqwidgets-blazor-app

III. Add the jQWidgets.Blazor package:

dotnet add package jQWidgets.Blazor

IV. Open _Imports.razor and add the following at the bottom:

@using jQWidgets.Blazor.Components

V. Open wwwroot/index.html and add the needed styles and scripts. For example if you are going to use JqxBarGauge, the file should look like this:

VI. Open Pages/Index.razor and replace the code as follows:

VII. Start the app and check the result:

dotnet watch run

Events Methods & Properties

I. Events

Below is an example of listening to the JqxBarGauge onDrawEnd event and then doing something with the result:

II. Methods & Properties

In order to use methods, first you need to make a reference to the component: