Button ShowLoading method doesn't disable button if Button has Disabled parameter on it

[ervintuzlic]

Description: If button has parameter Disabled="@SomeCondition" on it it will not disable it when ShowLoading method is called.

Code to test:

@page "/counter"
<p role="status">Current count: @currentCount</p>

<Button @ref="clickMeButton" Type="ButtonType.Button" Disabled="@IsDisabled" Outline="true" @onclick="IncrementCount" Color="ButtonColor.Primary">Click me</Button>

@code {
    private bool IsDisabled => currentCount > 3;

    private Button? clickMeButton { get; set; }

    private int currentCount = 0;

    private async void IncrementCount()
    {
        clickMeButton?.ShowLoading("Button is loading but is enabled");

        await Task.Delay(5000); // API call

        currentCount++;

        clickMeButton?.HideLoading();
    }
}

Expected Behavior: It should be disabled no matter what condition in Parameter Disabled is set when ShowLoading is called.

Versions: BlazorBootstrap: On main project version is 1.8.3 but I tested it on the latest it still has problem .NET Version: .NET 7

[gvreddy04]

@ervintuzlic By default, ShowLoading method will disable the button. Refer: https://demos.blazorbootstrap.com/buttons#show-hide-loading-spinner

In your case, you want to disable the button based on the increment. So, do not use Disabled parameter here. Instead use clickMeButton.Disabled = currentCount > 3;.

<p role="status">Current count: @currentCount</p>

<Button @ref="clickMeButton" Type="ButtonType.Button" Outline="true" @onclick="IncrementCountAsync" Color="ButtonColor.Primary">Click me</Button>

@code {
    private Button? clickMeButton;

    private int currentCount = 0;

    private async Task IncrementCountAsync() // do not use async void
    {
        clickMeButton?.ShowLoading("Button is loading but is enabled");

        await Task.Delay(5000); // API call

        currentCount++;

        clickMeButton?.HideLoading();

        clickMeButton.Disabled = currentCount > 3;
    }
}

Demo:

https://github.com/vikramlearning/blazorbootstrap/assets/2337067/ffc681fd-2771-4458-9e29-fa76cf24296a