BlazorStrap: BlazorInput two-way binding doesn't work

When using the BlazorInput tag you are unable to use two-way binding to the value. Change text and press submit.

<BlazorInput InputType="InputType.Text" bind-Content="@Content" />@*Two-Way?*@
<input type="text" bind="@Content2" />
<BlazorButton Color="Color.Primary" OnClick="@Submit">Submit</BlazorButton>
@functions {
    private string Content { get; set; }
    private string Content2 { get; set; }
    async void Submit(UIMouseEventArgs e)
    {
        Console.WriteLine(Content);  // Not work
        Console.WriteLine(Content2); // Work
    }
}

About this issue

Original URL
State: closed
Created 5 years ago
Comments: 21 (18 by maintainers)

Most upvoted comments

It seems the syntax for binding has changed. Most examples found on line look like this and do not work: input type=“text” bind=“@Name” />

The new syntax with @bind seems ok: input type=“text” @bind=“Name” />

This commit on May 30 changed the syntax: https://github.com/aspnet/AspNetCore/commit/dd07fa09d2895bba3231d9e433da1a4671630512#diff-438bb5dff82affac680fa750d6535658

rpskelton2 on Jun 18, 2019

From looking at documentation and samples it appears the razor.g.cs file should contain onchange statements like below. I’m not any in mine and two way binding is not working on any of my samples.

builder.AddAttribute(5, “onchange”, Microsoft.AspNetCore.Components.EventCallback.Factory.CreateBinder(this, __value => Title = __value, Title));

rpskelton2 on Jun 17, 2019

Yes, that’s correct. In preview 6, you’re actually supposed to use @bind="@Name". They’re hoping to eventually shorten that to @bind="Name". But bind without the @ is no longer correct — attributes without the @ are now HTML, and attributes with it C#.

chucker on Jun 19, 2019

Any thoughts about this?

I mean… the linked page does say “Developers building their own input components should use Razor syntax.” 😉

chucker on May 3, 2019

Have you had a look at this? This is the implmentation for Blazor’s EditForm Input element variants? Might be a good example to follow?

https://github.com/aspnet/AspNetCore/blob/master/src/Components/Components/src/Forms/InputComponents/InputText.cs

razfriman on Apr 25, 2019