Problem With Change and ValueChange on SfDropDownList

[Alexandre]

Hello,

I am trying to do a cascading dropdown, but I am having trouble activating the change event for the first  SfDropDownList.

I have made a code snippet to try and see wich event fires, but none of them did.

Could you tell me what am I doing wrong?

Regards,

Alexandre

@page "/test-dropdown"

@using Syncfusion.Blazor.DropDowns

@using FrotiXBlazorMaui.Shared

<SfDropDownList TValue="string" TItem="SelectListItemModel"

                DataSource="@Items"

                Placeholder="Selecione um item"

                Value="@SelectedValue"

                ValueChange="OnValueChange"

                Change="OnChange">

    <DropDownListFieldSettings Text="Text" Value="Value"></DropDownListFieldSettings>

</SfDropDownList>

<p>Valor Selecionado: @SelectedValue</p>

@code {

    private List<SelectListItemModel> Items = new List<SelectListItemModel>

    {

        new SelectListItemModel { Text = "Item 1", Value = "Item1" },

        new SelectListItemModel { Text = "Item 2", Value = "Item2" },

        new SelectListItemModel { Text = "Item 3", Value = "Item3" }

    };

    private string SelectedValue { get; set; } = string.Empty;

    private async Task OnValueChange(Syncfusion.Blazor.DropDowns.ChangeEventArgs<string, SelectListItemModel> args)

    {

        SelectedValue = args.Value;

        Console.WriteLine($"ValueChange disparado: {args.Value}");

        await Task.CompletedTask;

    }

    private async Task OnChange(Syncfusion.Blazor.DropDowns.ChangeEventArgs<string, SelectListItemModel> args)

    {

        SelectedValue = args.Value;

        Console.WriteLine($"Change disparado: {args.Value}");

        await Task.CompletedTask;

    }

}

[Yohapuja Selvakumaran]

Hi Alexandre

Thank you for reaching out to us.

We have reviewed your requirement, and we would like to inform you that the ValueChange event should be used inside the <DropDownListEvents> tag to handle value changes in the DropDownList. Please refer to the documentation below for more details on handling events:

Documentation: https://blazor.syncfusion.com/documentation/dropdown-list/selection#valuechange-event

You can implement it as shown in the following example:

            <SfDropDownList TItem="Country" TValue="string" Placeholder="Select a country" DataSource="@Countries" @bind-Value="SelectedCountry">

                <DropDownListEvents TItem="Country" TValue="string" ValueChange="OnCountryChange"></DropDownListEvents>

                <DropDownListFieldSettings Text="CountryName" Value="CountryId"></DropDownListFieldSettings>

            </SfDropDownList>

Sample: https://blazorplayground.syncfusion.com/BtLytUWaqxCHabaw

For further reference, please review the following demo and documentation:

Demo: https://blazor.syncfusion.com/demos/dropdown-list/cascading?theme=fluent2

Documentation: https://blazor.syncfusion.com/documentation/dropdown-list/cascading

Regards,

Yohapuja S

[Alexandre]

Thank you!

I will try to make this solution work on my project.

Regards,

Alexandre

[Shereen Shajahan]

Hi Alexandre,

We are marking this forum as solved. Please get back to us for assistance in the future.

Regards,

Shereen