BlazingMahi.Mbutton
0.4.0
dotnet add package BlazingMahi.Mbutton --version 0.4.0
NuGet\Install-Package BlazingMahi.Mbutton -Version 0.4.0
<PackageReference Include="BlazingMahi.Mbutton" Version="0.4.0" />
paket add BlazingMahi.Mbutton --version 0.4.0
#r "nuget: BlazingMahi.Mbutton, 0.4.0"
// Install BlazingMahi.Mbutton as a Cake Addin
#addin nuget:?package=BlazingMahi.Mbutton&version=0.4.0
// Install BlazingMahi.Mbutton as a Cake Tool
#tool nuget:?package=BlazingMahi.Mbutton&version=0.4.0
BlazingMahi Mbutton
This is a customized button implementation for Blazor and Razor Components applications. It provides the ability to disable the button when clicked.
Getting Started
You can install the package via the NuGet package manager just search for BlazingMahi. You can also install via powershell using the following command.
Install-Package BlazingMahi.Mbutton
Add Imports
Add the following to your _Imports.razor or to your razor page files.
@using BlazingMahi.Mbutton
Add Mbutton Component
Mbutton is configured using parameters on the <Mbutton></Mbutton>
component. The following options are available.
- Class
- OnClick
- DisableOnClick (Default: false)
- Type (Default: button )
- SpinnerOnDisabled
- SpinnerClass (Default: "spinner-border spinner-border-sm")
Example: add Bootstrap button classes, OnClick event and set the disable to true
<Mbutton Class="btn btn-primary" OnClick="IncrementCount" DisableOnClick="true">Click Me</Mbutton>
<p>Current count: @currentCount</p>
@code {
private int currentCount = 0;
private async Task IncrementCount()
{
currentCount++;
}
}
The above example will disable the button when clicked and then call the IncrementCount()
Method
Re-enable the button after a Task is completed.
Using the component reference you have access to two methods. EnableButton()
and DisableButton()
<Mbutton Class="btn btn-primary" OnClick="IncrementCount" DisableOnClick="true" @ref="mbutton">Click Me</Mbutton>
@code {
private int currentCount = 0;
Mbutton mbutton;
private async Task IncrementCount()
{
await Task.Delay(3000);
currentCount++;
mbutton.EnableButton();
}
}
Add Bootrap Spinner when disabled.
You can add a Bootstap spinner to the button when the button is disabled on click.
<Mbutton Class="btn btn-primary"
OnClick="IncrementCount"
DisableOnClick="true"
SpinnerOnDisabled="true">Click Me</Mbutton>
<p>Current count: @currentCount</p>
@code {
private int currentCount = 0;
private void IncrementCount()
{
currentCount++;
}
}
Set Spinner location
You can set the spinner location on the left (default) , right or only show the spinner.
spinnerPosition="Mbutton.SpinnerPosition.Left"
spinnerPosition="Mbutton.SpinnerPosition.Right"
spinnerPosition="Mbutton.SpinnerPosition.Only"
<Mbutton Class="btn btn-primary"
OnClick="IncrementCount"
DisableOnClick="true"
@ref="mbutton"
SpinnerOnDisabled="true"
spinnerPosition="Mbutton.SpinnerPosition.Only">Click Me</Mbutton>
<p>Current count: @currentCount</p>
@code {
private int currentCount = 0;
Mbutton mbutton;
private async Task IncrementCount()
{
await Task.Delay(3000);
currentCount++;
mbutton.EnableButton();
}
}
You can also overide the default Spinner class
Override with other Bootstrap spinner properties https://getbootstrap.com/docs/4.5/components/spinners/#growing-spinner
<Mbutton Class="btn btn-primary"
OnClick="IncrementCount"
DisableOnClick="true"
SpinnerOnDisabled="true"
SpinnerClass="spinner-grow spinner-grow-sm">Click Me</Mbutton>
Product | Versions Compatible and additional computed target framework versions. |
---|---|
.NET | net5.0 was computed. net5.0-windows was computed. net6.0 was computed. net6.0-android was computed. net6.0-ios was computed. net6.0-maccatalyst was computed. net6.0-macos was computed. net6.0-tvos was computed. net6.0-windows was computed. net7.0 was computed. net7.0-android was computed. net7.0-ios was computed. net7.0-maccatalyst was computed. net7.0-macos was computed. net7.0-tvos was computed. net7.0-windows was computed. net8.0 was computed. net8.0-android was computed. net8.0-browser was computed. net8.0-ios was computed. net8.0-maccatalyst was computed. net8.0-macos was computed. net8.0-tvos was computed. net8.0-windows was computed. |
.NET Core | netcoreapp2.0 was computed. netcoreapp2.1 was computed. netcoreapp2.2 was computed. netcoreapp3.0 was computed. netcoreapp3.1 was computed. |
.NET Standard | netstandard2.0 is compatible. netstandard2.1 was computed. |
.NET Framework | net461 was computed. net462 was computed. net463 was computed. net47 was computed. net471 was computed. net472 was computed. net48 was computed. net481 was computed. |
MonoAndroid | monoandroid was computed. |
MonoMac | monomac was computed. |
MonoTouch | monotouch was computed. |
Tizen | tizen40 was computed. tizen60 was computed. |
Xamarin.iOS | xamarinios was computed. |
Xamarin.Mac | xamarinmac was computed. |
Xamarin.TVOS | xamarintvos was computed. |
Xamarin.WatchOS | xamarinwatchos was computed. |
-
.NETStandard 2.0
- Microsoft.AspNetCore.Components (>= 3.1.8)
- Microsoft.AspNetCore.Components.Web (>= 3.1.8)
NuGet packages
This package is not used by any NuGet packages.
GitHub repositories
This package is not used by any popular GitHub repositories.