Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Question: How do I make an InputText component use oninput event instead of "onchange" event ? #12657

Closed
enetstudio opened this issue Jul 27, 2019 · 3 comments
Labels
area-blazor Includes: Blazor, Razor Components question

Comments

@enetstudio
Copy link

I have an InputText Component within an EditForm Component, and I want to change the event handlers from "onchange" to "oninput" so that I can display the changes as I type text into the input element. I've tried something like this, but it seems not to be working:

<InputText Id="name" Class="form-control" @bind-Value="Model.Name" @bind-Value:event="oninput"></InputText >

Thanks in advance...

@mkArtakMSFT mkArtakMSFT added the area-blazor Includes: Blazor, Razor Components label Jul 29, 2019
@mkArtakMSFT
Copy link
Member

Thanks for contacting us, @enetstudio .
This is not supported. We'll try to add more clarity here and show how this can be done as part of the following issue: dotnet/AspNetCore.Docs#13541

@SteveSandersonMS
Copy link
Member

For anyone wondering, you can subclass InputText to change how it renders. For example, to make it use the oninput event, create MyInputText.razor containing:

@inherits Microsoft.AspNetCore.Components.Forms.InputText
<input @attributes="@AdditionalAttributes" class="@CssClass" @bind="@CurrentValueAsString" @bind:event="oninput" />

Now when you use <MyInputText @bind-Value="@someval" /> it will behave just like InputText except it updates on each keystroke.

@enetstudio
Copy link
Author

Thanks so much for this, maestro!

@ghost ghost locked as resolved and limited conversation to collaborators Dec 2, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
area-blazor Includes: Blazor, Razor Components question
Projects
None yet
Development

No branches or pull requests

3 participants