Getting Dropdown List to reflect canging data source

[Martin]

I have a drop down list whose datasource is updated from another control. The dropdown list is part of a trio of cascading dropdowns. 

I call RefreshDataAsync to update the dropdowns datasource having changed it from the other control.   I can make the dropdown reflect the datasource change by refreshing the entire page using  uriHelper.NavigateTo(uriHelper.Uri, forceLoad: true); but that obviously looses state of all controls on the page which is not desirable. 

Is there a better way to do this so state is not lost on the other controls on the page (like calling StaeHasChanged from the dropdown whose datasource has changed?  

Many thanks in advance

[Priyanka Karthikeyan]

Hi Martin,

To achieve your requirement, you can change the data source and re-render the dropdown list component when the button is clicked. Please see the following code snippet:

<SfButton @onclick="onClick">Click</SfButton>

 

@if (ButtonValue)

 

{

    <SfDropDownList TItem="GameFields" TValue="string" PopupHeight="230px"  Placeholder="e.g. Basketball" @bind-Value="@DropDownValue" DataSource="@Games">

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

    </SfDropDownList>

}

private async Task onClick(Microsoft.AspNetCore.Components.Web.MouseEventArgs args)    {

      this.ButtonValue = false;

       this.Games = new List<GameFields>()

    {

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

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

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

        new GameFields(){ ID= "Game10", Text= "Tennis"}

    };

       await Task.Delay(10);

       this.ButtonValue = true;

}

For further details, please check the attached sample.

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

Regards,

Priyanka K

Attachment: DropdownlistSample_839c0375.zip

[Martin]

Many thanks, that worked.

I would never have thought of forcing rerender that way!

[Deepak Ramakrishnan]

Hello Martin,

We are delighted to hear that your requirement has been fulfilled. Please do not hesitate to contact us if you have any further queries.

Thanks,

Deepak R.