Cannot set the input value using e.Value = “value” in Blazor

Question

I have a simple input with the type text:

<input type="text" @oninput="Input_OnInput" />

As you can see, the oninput event is handled by the Input_OnInput method. Here's its implementation:

private void Input_OnInput(ChangeEventArgs e)
{
    string inputValue = e.Value.ToString();
    e.Value = inputValue + "ABC";
}

All it does is it appends three characters to the input string and then assigns the new string to the e.Value property.

However, for some reason that I'm unable to understand, this doesn't work, and the new string is not shown in the input text on the UI.

BTW, perhaps I should mention that the method DOES get called, and that specific line DOES get executed, but it doesn't seem to work as expected.

I'm using Blazor server-side hosting model, if that matters.

Answer 1

That's not how you're supposed to update a input in Blazor, please review

Sample code: https://docs.microsoft.com/en-us/aspnet/core/blazor/components/data-binding?view=aspnetcore-3.1

<p>
    <input @bind="currentValue" /> Current value: @currentValue
</p>

<p>
    <input @bind="CurrentValue" /> Current value: @CurrentValue
</p>

@code {
    private string currentValue;

    private string CurrentValue { get; set; }
}