Blazor web assembly. Clear input controls

Question

I have built a small application in Blazor web assembly using MudBlazor. I have a method, Clear(), which basically clears MudTextFields upon calling. After 10 seconds, this method should be called. How and where should I call this method? As an example, I am using the following:

<div class="col-md-12">
    <MudField Label="Country" Variant="Variant.Outlined" Adornment="Adornment.End"     AdornmentIcon="@Icons.Material.Filled.CheckCircle"     AdornmentColor="Color.Success">@_Country</MudField>
</div>

c# code:

private void Clear()
{
    _Country = string.Empty;
}

I have to call this method for my code to work.

Answer 1

You can use Task.Delay() ms docs where you can pass an int parameter which is time in milliseconds. So for a 10 seconds delay it would beawait Task.Delay(10000).

I think you should also include a cancellation token so that if the method is called before one of the delays is finished it will cancel the previous delay and start from 0 again, otherwise it will clear multiple times on separate timers.

private CancellationTokenSource _cts = new CancellationTokenSource();
async Task ClearAfterDelay(string inputValue)
{
    try
    {
        _cts.Cancel(); 
        _cts = new CancellationTokenSource(); 
        //assign the values to the TextFields
        await Task.Delay(10000,_cts.Token);
        //clear the values of the TextFields
    }
    catch (TaskCanceledException)
    {
        // for logic if task cancelled prematurely
    }

}

I've setup a MudBlazor snippet Note the snippet is shortened to show only 2 sec delay.

Also, you might or might not need to call a StateHasChanged() After the delay is finished and the inputs are cleared.