Blazor problem connecting the UI with the code-CodePudding

I'm using Blazor Server application in Visual Studio 2019. In the .razor page I have:

<div >
    <div >
        <div >
            <label for="ConnectionStringEdit" id="Label1">Connection String for destination</label>
        </div>
        <div >
            <input type="text" id="ConnectionStringEdit" name="ConnectionStringEdit" text=@ConnectDestination spellcheck="false" style="width: 585px; height: 26px;" >
        </div>
        <div >
            <input type="submit" id="btnConnect" name="btnConnect" value="Connect"  @onclick="Connect1">
        </div>
    </div>
</div>

now in the code part I have

@code {


    private string ConnectDestination { get; set; } = "";
    
    private void Connect1()
    {
        if (ConnectDestination.Length > 0)
        {
            // do something
        }
    }
}

When I insert something in the Input and I press the button, ConnectDestination doesn't take the value of the Input Control. So this last If condition is never true. How do I get the inserted value of the Input control named ConnectionStringEdit?

Thanks

CodePudding user response：

It should be @bind-value="@ConnectDestination"

CodePudding user response：

You can try

<input type="text" id="ConnectionStringEdit" name="ConnectionStringEdit" @bind=@ConnectDestination spellcheck="false" style="width: 585px; height: 26px;" >

<input type="text" id="ConnectionStringEdit" name="ConnectionStringEdit" value="@ConnectDestination"
           @onchange="@((ChangeEventArgs __e) => ConnectDestination = __e?.Value?.ToString())" spellcheck="false" style="width: 585px; height: 26px;" >