Aspnetcore: Preview 7 Blazor ServerSide @Bind VS (value + @onchange) Type Conversion

Created on 29 Jul 2019  路  5Comments  路  Source: dotnet/aspnetcore

Hello!
I open another issue here, since @guardrex recommended so here https://github.com/aspnet/AspNetCore.Docs/issues/13539#issuecomment-516067902

It's related to https://github.com/aspnet/AspNetCore/issues/12690

The issue is that if I use @bind inside a custom input component, while it binds the property with the <input> value, it doesn't raise any callback for parent components using it be notified.

So @mkArtakMSFT recommended using the (value + @onchange) route, which is fine... but then I lose the automatic type conversion that @bindprovides....

For example, if I use @bind , the <input> value (if I use decimal type), gets formatted with my current computer's number formatting settings..... If I change those settings, the formatting works accordingly.

With the (value + @onchange) way, I have to provide the type conversion system myself, is this the way it should work?

Regards!!

area-blazor question

All 5 comments

@chrdlx There are a couple of doc issues for Pre8 that indicate new functionality in these areas for Pre8. I suppose none of it will work until Pre8, but you could try adding type="number" step="any" to your <input> to see if it has any effect.

Thanks for contacting us, @chrdlx.
It's not really clear what you are trying to do and what is specifically not working. Can you please provide more context?

Cross-ref to my possible hacky workaround 馃檲 (that does work in this scenario) ...

https://github.com/aspnet/AspNetCore.Docs/issues/13539#issuecomment-516202149

I'm waiting for Dan to come on that issue and tell me what a GooberRex:tm: I am. :smile:

Thanks for contacting us, @chrdlx.
It's not really clear what you are trying to do and what is specifically not working. Can you please provide more context?

I'm trying to create a custom input component.. a basic one, like this:

@typeparam T
<div>
    My custom input -->
    <input @bind-value="@val" />
</div>
@code
{
    [Parameter]
    public T val { get; set; }
}

I want to use @bind because it provides/will provide out of the box:

1) Automatic formatting of types depending culture.
2) Custom formats
3) Rollback the typed changes in the input if the format isn't valid.

BUT... using @bind doesn't have an eventcallback, so a parent component using my custom input component will never get notified of a property change, thus not updating the required UI.

The given alternative is to use (Value + @onchange), which is fine, but I couldn't replicate the three features I need from @bind which I enumerated previously.

That's why in my project, for the moment, I endedup using strings everywhere, and then using Convert.ToInt/Decimal when required.

Regards!

Was this page helpful?
0 / 5 - 0 ratings