Pre-selected items do not show in multiselect dropdown control inside a SfDialog object

[João]

Hi,

I found a problem in the code below. The items do not appear in the visible part of the combobox when the page is loaded however, when I expand the combobox, the items show selected.

Can you please explain what I'm doing wrong? The version of Syncfusion.Blazor is 18.2.0.46 (the latest). This same code was working fine in version 18.1.0.x.

@using Syncfusion.Blazor.Navigations

@using Syncfusion.Blazor.DropDowns

@using Syncfusion.Blazor.Popups

<SfDialog IsModal="false" Width="250px" AllowDragging="true" ShowCloseIcon="true" CloseOnEscape="true">

    <DialogTemplates>

        <Content>

            <SfMultiSelect Mode="@VisualMode.CheckBox" ShowDropDownIcon="true" TValue="string[]" DataSource="@Countries" Value="@SelectedCountries">

                <MultiSelectFieldSettings Text="Name" Value="Id"></MultiSelectFieldSettings>

            </SfMultiSelect>

        </Content>

    </DialogTemplates>

</SfDialog>

@code

{

    public class Country

    {

        public string Id { get; set; }

        public string Name { get; set; }

    }

    List<Country> Countries = new List<Country>() {new Country{Id = "1", Name = "Australia"},new Country {Id = "2",Name = "England"},new Country{Id = "3",Name = "France"}};

    string[] SelectedCountries = new string[] {"2", "3"};

}

[Ponmani Murugaiyan]

Hi João, 

 

Greetings from Syncfusion support. 

 

We have validated and replicated your reported issue in our end. We will update further details in 2 business days (August 04, 2020). We appreciate your patience until then. 

 

Regards, 

Ponmani M 

[Ponmani Murugaiyan]

Hi João,  

  

Sorry for the inconvenience caused. 

  

We will update further details regarding the timeline for the fix in 2 business days (August 06, 2020). We appreciate your patience until then.  

  

Regards,  

Ponmani M 

[Ponmani Murugaiyan]

Hi João,  

Thanks for the patience. 

We have validated your reported issue and prepared sample as per your requirement. We suggest you to call the refresh method in dialog open event to get rid of the reported issue. Please find the code snippet below for your reference.  

SfButton @onclick="@OnClicked">Open Modal Dialog</SfButton> 

<SfDialog @bind-Visible="@IsVisible" Width="250px" IsModal="true"> 

    <DialogEvents OnOverlayClick="OnOverlayclick"> 

    </DialogEvents> 

    <DialogTemplates> 

        <Content> 

            <div class="control_wrapper"> 

                <SfMultiSelect TValue="string[]" @ref=" mulObj" Placeholder="e.g. Australia" Mode="VisualMode.CheckBox" DataSource="@Country" Value="@SelectedCountries" ShowDropDownIcon="true"> 

                    <MultiSelectFieldSettings Value="Code" Text="Name"></MultiSelectFieldSettings> 

                </SfMultiSelect> 

            </div> 

        </Content> 

    </DialogTemplates> 

    <DialogEvents Opened="@open"></DialogEvents> 

</SfDialog> 

 

@code { 

    private bool IsVisible { get; set; } = true; 

    SfMultiSelect<string[]> mulObj; 

    private void open() 

    { 

        mulObj.Refresh(); 

    } 

... 

} 

   

Output: 

 

 

 

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/BlazorApp1-1324045235  

 

Kindly check with the above sample. Please get back us if you need further assistance. 

 

Regards, 

Ponmani M

[Svein]

Hi,

Thank you for the example above, it is just what I'm looking for. But it's not working for version 20.x. 

The example is written for version 18.x.

Can you please update the example above to work with SyncFusion.Blazor 20.x?

I Tried, but did not find a way to make it work with the latest version of SyncFusion.Blazor

Kind Regards

Svein Berger

[Mohanraj Mathaiyan]

Hi Svein,

We suggest to use RefreshDataAsync() method which is used to refresh the popup list items.

This method is available in latest Nuget version(20.2.43). we have attached the APL documentation and code snippet for your reference.

 

@code {

    private bool IsVisible { get; set; } = true;

    SfMultiSelect<string[],Countries> mulObj;

    private void open()

    {

        mulObj.RefreshDataAsync();

    }

 

API documentation : https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.DropDowns.SfMultiSelect-2.html#Syncfusion_Blazor_DropDowns_SfMultiSelect_2_RefreshDataAsync

Regards,

Mohanraj M