None of MultiSelect's event works.

[Brian]

Hi team,

You can compile and run the sample, and you could see none of MultiSelect's event works (I bind only three, but not limited to them). Could you tell me what's wrong with it?

Thanks.

Attachment: SyncfusionBlazorMultiSelect_84198a40.rar

[Sureshkumar P]

Hi Brian, 

 

Greetings from Syncfusion support. 

 

Based on your shared information with sample. we suggest you use MultiSelectEvents tag to bind the events as like below to trigger the events.  

 

Please find the code example. 

<div id = "ControlRegion"> 

<div class="control-section"> 

    <div class="control_wrapper"> 

            <div class="control-styles"> 

                <h5> Default Mode</h5> 

                <SfMultiSelect TValue="string[]" Mode="@VisualMode.Default" Placeholder="Favorite Sports" DataSource="@Games" > 

                   <MultiSelectEvents TValue="string[]" ValueChange="OnChange" OnValueSelect="OnSelect"></MultiSelectEvents> 

                    <MultiSelectFieldSettings Text="Text" Value="ID"></MultiSelectFieldSettings> 

                </SfMultiSelect> 

            </div> 

            <div class="control-styles"> 

                <h5>Box Mode</h5> 

                <SfMultiSelect TValue="string[]" Mode="@VisualMode.Box" Placeholder="Favorite Sports" DataSource="@Games"> 

                    <MultiSelectFieldSettings Text="Text" Value="ID"></MultiSelectFieldSettings> 

                </SfMultiSelect> 

            </div> 

            <div class="control-styles"> 

                <h5>Delimiter Mode</h5> 

                <SfMultiSelect TValue="string[]" Mode="@VisualMode.Delimiter" Placeholder="Favorite Sports" DataSource="@Games"> 

                    <MultiSelectFieldSettings Text="Text" Value="ID"></MultiSelectFieldSettings> 

                </SfMultiSelect> 

            </div> 

        </div> 

</div> 

</div> 

<br/> 

<div> 

  <h3>Selected Features:</h3> 

    <ul class="ulstyle"> 

      <li class="list"> MultiSelect Dropdown Samples - Default</li> 

      <li class="list"> Theme - Material</li> 

    </ul> 

</div> 

<br/> 

<style> 

    .control-styles{ 

        margin-bottom:3%; 

    } 

    .control_wrapper { 

        width: 350px; 

        margin: 0 auto; 

        padding: 2%; 

    } 

    .ulstyle { 

        margin: 0px; 

        padding-left: 20px; 

        display: inline-block; 

    } 

    .list { 

    float: left; 

    line-height: 20px; 

    margin: 10px; 

    min-width: 370px; 

    } 

</style> 

@code{ 

    public class GameFields 

    { 

        public string ID { get; set; } 

        public string Text { get; set; } 

    } 

    private List<GameFields> Games = new List<GameFields>() 

{ 

        new GameFields(){ ID= "Game1", Text= "American Football" }, 

        new GameFields(){ ID= "Game2", Text= "Badminton" }, 

        new GameFields(){ ID= "Game3", Text= "Basketball" }, 

        new GameFields(){ ID= "Game4", Text= "Cricket" }, 

        new GameFields(){ ID= "Game5", Text= "Football" }, 

        new GameFields(){ ID= "Game6", Text= "Golf" }, 

        new GameFields(){ ID= "Game7", Text= "Hockey" }, 

        new GameFields(){ ID= "Game8", Text= "Rugby"}, 

    }; 

 

    private void OnChange(MultiSelectChangeEventArgs<string[]> args) 

    { 

    } 

 

    private void OnSelect(SelectEventArgs args) 

    { 

    } 

 

    private void OnFocus(Syncfusion.Blazor.DropDowns.MultiSelectEvents<string[]> args)  

    { 

    } 

} 

 

 

Regards, 

Sureshkumar P 

[Brian]

Thank, I got it.

[Sureshkumar P]

Hi Brian, 

 

Thanks for the update. 

 

Regards, 

Sureshkumar P