Why would the onChange event of InputText not fire in Blazor?

Question

I have the following razor markup in a blazor component:

<div class="form-group row">
    <label for="name">Contact: </label>
    <InputText id="name" @bind-Value="Contact.Name" @onchange="NameChanged"></InputText>
</div>

When I modify the contact name on the form and tab out of the control the NameChange method is never called. Is there something else that I need to do in order to get the onChange event to trigger?

Answer 1

You cannot do @bind-value and @onchange because bi-directional binding subscribe to the onchange event.

But you can do it manualy :

<div class="form-group row">
    <label for="name">Contact: </label>
    <InputText id="name" Value="@Contact.Name" ValueChanged="NameChanged" ValueExpression="() => Contact.Name" ></InputText>
</div>

@code {
    private void NameChanged(string value)
    {
        Contact.Name = value;
    }
}

Answer 2

I found a much shorter and simpler variant.

<input @bind="searchString" @bind:event="oninput" @onkeyup="SearchChanged" >

Any method can then be called with @onkeyup.