Blazor: How to use the onchange event in <select> when using @bind also?

Question

I need to be able to run a function after a selection in made in a <select>. The issue is I'm also binding with @bind and I get a error when I try to use @onchange stating that it is already in use by the @bind. I tried using @onselectionchange, but that does nothing(doesn't run the function). I could forget the @bind and just assign @onchange to a function, but I'm not sure how to pass the selected value to the function.

I have the following code:

<select @bind="@SelectedCustID" @ @onchange="@CustChanged" class="form-control">     @foreach (KeyGuidPair i in CustList)     {         <option value="@i.Value">@i.Text</option>     } </select> 

Thanks.

Answer 1

<select @bind="MyProperty"> <option>Your Option<option> </select>  @code  {     private string myVar;      public string MyProperty     {         get { return myVar; }         set         {             myVar = value;             SomeMethod();         }     }      private void SomeMethod()     {         //Do something     } } 

Answer 2

@bind is essentially equivalent to the having both value and @onchange, e.g.:

<input @bind="CurrentValue" /> 

Is equivalent to:

<input value="@CurrentValue" @onchange="@((ChangeEventArgs e) => CurrentValue = e.Value.ToString())" /> 

Since you've already defined @onchange, instead of also adding @bind, just add value to prevent the clash:

<select value="@SelectedCustID" @onchange="@CustChanged" class="form-control">     @foreach (KeyGuidPair i in CustList)     {         <option value="@i.Value">@i.Text</option>     } </select> 

Source: https://docs.microsoft.com/en-us/aspnet/core/blazor/components/data-binding?view=aspnetcore-3.1