CODEWITHSUNDEEP
c#blazormudblazor
Riley Christian
Riley Christian

Reputation: 225

Enable the button when the text in MudTextField has changed

I am using MudBlazor library for UI in blazor application and i would like to enable a button whenever the text in the MudTextField has changed. So far i am able to enable the button only when the user clicks outside the text field.

<MudTextField Value="Name" HelperText="Enter your name" ValueChanged="@(EventCallback.Factory.Create<string>(this, OnNameChanged))"></MudTextField>
<MudButton Variant="Variant.Filled" Color="Color.Primary" Disabled="(!HasNameChanged)">Save</MudButton>

@code {
    public string Name { get; set; } = "John Smith";

    public bool HasNameChanged {get; set;} = false;


    public void OnNameChanged(string value)
    {
        Name = value;
        HasNameChanged = true;
    }
}

The working demo is here

Upvotes: 0

Views: 1557

Answers (2)

kenny
kenny

Reputation: 22394

As well as @Lex's answer, you can use Debounce in milliseconds, so you can control the delay or not evaluate every single key typed.

<MudTextField Value="Name" 
              HelperText="Enter your name" 
              Debounce="500"
              ValueChanged="@(EventCallback.Factory.Create<string>(this, OnNameChanged))"></MudTextField>

Upvotes: 0

Lex
Lex

Reputation: 7194

Add the Immediate="true" attribute to your <MudTextField> component.

<MudTextField Value="Name" 
              HelperText="Enter your name" 
              Immediate="true"
              ValueChanged="@(EventCallback.Factory.Create<string>(this, OnNameChanged))"></MudTextField>

Upvotes: 2

Related Questions