Blazor Input OnChange Event Handling

[BrandonGruber]

I am having trouble finding the new value in the Input OnChange event.

I am using an alias for the Smart.Blazor.Event class as shown here:

@using SmartInputChangedEvent = Smart.Blazor.Event;

Below is my input markup:

<Input Value=@ManagedChecklistFilter.ChecklistType DataSource=ChecklistTypeOptions OnChange=”(SmartInputChangedEvent e) => FiltersChanged(ChecklistFilterFields.ChecklistType, e)”></Input>

Below is the method I am calling to capture the event:

private async Task FiltersChanged(ChecklistFilterFields field, SmartInputChangedEvent e)
{
if (e is not null)

I am getting the event with 22 key value pairs but none of them contain the new value.

[BrandonGruber]

To add more information, below are the key/value pairs captured in e:

{[isTrusted, ValueKind = True : “True”]}
{[type, ValueKind = String : “change”]}
{[target, ValueKind = Object : “{“id”:””}”]}
{[currentTarget, null]}
{[eventPhase, ValueKind = Number : “0”]}
{[bubbles, ValueKind = True : “True”]}
{[cancelable, ValueKind = False : “False”]}
{[defaultPrevented, ValueKind = False : “False”]}
{[composed, ValueKind = False : “False”]}
{[timeStamp, ValueKind = Number : “11000.399999976158”]}
{[srcElement, ValueKind = Object : “{“id”:””}”]}
{[returnValue, ValueKind = True : “True”]}
{[cancelBubble, ValueKind = False : “False”]}
{[NONE, ValueKind = Number : “0”]}
{[CAPTURING_PHASE, ValueKind = Number : “1”]}
{[AT_TARGET, ValueKind = Number : “2”]}
{[BUBBLING_PHASE, ValueKind = Number : “3”]}
{[composedPath, ValueKind = Object : “{}”]}
{[initEvent, ValueKind = Object : “{}”]}
{[preventDefault, ValueKind = Object : “{}”]}
{[stopImmediatePropagation, ValueKind = Object : “{}”]}
{[stopPropagation, ValueKind = Object : “{}”]}

[ivanpeevski]

Hi Brandon,

 

There are a few different ways to capture the value of the input. For example, you can use two-way value binding:

<h3>@textValue</h3>
<Input @bind-Value=”@textValue” OnChange=”changeEvent”></Input>

@code{
string textValue = “”;
private void changeEvent(Event ev)
{
Console.WriteLine(textValue);

}
}

 

Best Regards,
Ivan Peevski
Smart UI Team
https://www.htmlelements.com/

[BrandonGruber]

Thanks for your help, I was able to get it working that way. I would suggest that the API docs be updated as it appears to suggest that the value should be in the event:
<table class=”table”>
<tbody>
<tr>
<td>OnChange</td>
<td>EventCallback<Event></td>
<td>This event is triggered when the selection is changed.</td>
<td>string label- The label of the new selected item., dynamic oldLabel- The label of the item that was previously selected before the event was triggered., dynamic oldValue- The value of the item that was previously selected before the event was triggered., dynamic value- The value of the new selected item.</td>
</tr>
</tbody>
</table>

[Author]

Posts