If having more than one button at a time running a task is problem then the buttons need to be mutually disabled. The ButtonBusyBCA component has a method named SetAvailability to help accomplish mutually disabling the buttons. Calling SetAvailability(false) will disable the button so it’s just a matter of creating references to the buttons. Then calling SetAvailability on the references in the methods handling the button clicks.
Here’s an example of the markup.
<div class="row mt-3">
<ButtonBusyBCA Label="ADD"
OnClick=@HandleAddButtonClick
@ref=AddButtonBusyBCA
ClassDiv="col-md-auto mt-3" />
<ButtonBusyBCA Label="UPDATE"
OnClick="@((e) => HandleSaveButtonClick(e, MyCar))"
@ref=SaveButtonBusyBCA
ClassDiv="col-md-auto mt-3" />
<ButtonBusyBCA Label="DELETE"
OnClick="@((e) => HandleDeleteButtonClick(e, MyCar))"
@ref=DeleteButtonBusyBCA
ClassDiv="col-md-auto mt-3" />
</div>
The button references
public ButtonBusyBCA? AddButtonBusyBCA { get; set; }
public ButtonBusyBCA? SaveButtonBusyBCA { get; set; }
public ButtonBusyBCA? DeleteButtonBusyBCA { get; set; }
The methods handling the button clicks
private async Task<EventCallback> HandleSaveButtonClick(EventArgs e, Car car)
{
SetAvailabilityOfMutuallyDisabledButtons(false);
await Task.Delay(ProcessTimeMilliseconds);
SetAvailabilityOfMutuallyDisabledButtons(true);
return EventCallback.Empty;
}
private async Task<EventCallback> HandleAddButtonClick(EventArgs e)
{
SetAvailabilityOfMutuallyDisabledButtons(false);
await Task.Delay(ProcessTimeMilliseconds);
SetAvailabilityOfMutuallyDisabledButtons(true);
return EventCallback.Empty;
}
private async Task<EventCallback> HandleDeleteButtonClick(EventArgs e, Car car)
{
SetAvailabilityOfMutuallyDisabledButtons(false);
await Task.Delay(ProcessTimeMilliseconds);
SetAvailabilityOfMutuallyDisabledButtons(true);
return EventCallback.Empty;
}
private void SetAvailabilityOfMutuallyDisabledButtons(bool isAvailable)
{
AddButtonBusyBCA?.SetAvailability(isAvailable);
SaveButtonBusyBCA?.SetAvailability(isAvailable);
DeleteButtonBusyBCA?.SetAvailability(isAvailable);
}
