How do I get simple blazor wasm 2 way binding setup?

Question

I'm scratching my head on why this two way binding does not work.

I'm binding to a string property on the page called result. This binding works for any initial values, and I see it set on my input text box.

But when I change the value programmatically to another value, the textbox still shows the old value. If I change the textbox value, the result property is also updated.

A small sample of the issue: https://blazorfiddle.com/s/t0t4wpsv

@page "/"

<input type="text" @bind-value=@result>

<input type="button" onclick="ChangeText" value="Submit" />

<p>@result</p>

@code {

    protected string result = "Hello";

    private void ChangeText()
    {
        result = "World";
    }
}

Answer 1

Change your input control onclick event to:

<input type="button" @onclick="ChangeText" value="Submit" />