Default Value Is Not Being Selected.

[j]

Hello,

   I can't seem to find a way to automatically select the first item as default selected value after DataSource has been asynchronously fetched from API on OnInitializedAsync(). I tried @bind-Value="@defaultValue" after the async and even put

defaultValue= ListOfItems[0].Name;

StateHasChanged();

in OnAfterRenderAsync() and OnAfterRender(), still not getting it.

Thanks,

[Saranya Dhayalan]

Hi J,

 

Thank you for contacting Syncfusion support 

 

We have validated your requirement with shared code snippet and unable to reproduce the reported issue in our end. We suspect the issue may occurred due to the value is bind to the component before binding the datasource. So we suggest to bind the value OnInitializedAsync() method, In our source handling the value bind based on datasource. Please find the code snippet for your reference.  

 

@using Syncfusion.EJ2.Blazor.DropDowns 

@using BlazorApp1.Data; 

@inject DropDownData dropdownService  

 

<EjsDropDownList TValue="string" @bind-Value="@DropVal" DataSource="@listData"> 

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

</EjsDropDownList> 

 

@code { 

 

    public string DropVal { get; set; } 

 

    List<Games> listData = new List<Games>(); 

 

    protected async override Task OnInitializedAsync() 

    { 

        listData = await dropdownService.getData(); 

        DropVal = listData[0].ID; 

 

    } 

} 

 

For your convenience, we have prepared a sample. Please find the below sample link: 

Sample link: https://www.syncfusion.com/downloads/support/forum/148929/ze/BLAZOR~1-1035892535 

We have provided Index property for select the item based on index value (index = 0) on initial rendering the component. Please find the code snippet for your reference.  

 

 

<EjsDropDownList TValue="string" DataSource="@listData" Index="0"> 

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

</EjsDropDownList> 

 

  

Regards,
Saranya D 

 

[j]

Hello Saranya D,

   I have already upgraded to v17.4.40, I'm having an error see attached file.

  Everything works fine if I don't add Value = "@_incidentID" into the <EjsDropDownList> except that it doesn't have initial selected value.

<EjsDropDownList TValue="string"

DataSource="@PatientIncidentViewModel"

Placeholder="DOIV"

FloatLabelType="FloatLabelType.Auto"

TItem="PatientIncidentViewModel"

Value="@_incidentID">

<DropDownListFieldSettings Text="GetSanitizeDate" Value="ID.Data" />

<DropDownListEvents TValue="string" ValueChange="onDoivChange" />

</EjsDropDownList>

private string _incidentID { get; set; }

protected override void OnParametersSet()

    {

        _status = PatientIncidentViewModel.FirstOrDefault().GetConvertedStatus;

_incidentID = PatientIncidentViewModel.FirstOrDefault().ID.Data;

    }

The DataSource PatientIncidentViewModel is coming from a submitted parameter and so I placed the _incidentID = PatientIncidentViewModel.FirstOrDefault().ID.Data; in the OnParameterSet()

Attachment: DropdownList_error_47cfc82b.zip

[Sureshkumar P]

Hi J, 

 

We have confirmed the reported issue as a bug at our end. And this fix will be included in our patch release scheduled on 14^th January 2020. We appreciate your patience until then.  

 

You can track the status of the reported issue from the below feedback link, 

 

Feedback Link: https://www.syncfusion.com/feedback/11162/default-value-not-being-selected-while-binding-the-data-as-complex-type  

 

Regards, 

Sureshkumar P. 

[j]

Hi,

   As an additional info, I tried using v17.3.29 from the given sample. yes it's working and only working if it has no real awaiting Tasks before this code

listData = await dropdownService.getData();

DropVal = listData[0].ID;

The code before that are actually coming from a real service, so I mean there's a certain delay. And when that code is placed after them, isn't working anything at all even if I put Task.Delay(5000) in each line right after fetching from the service like

var returned1 = await service1.getData();

await Task.Delay(5000);

_selectedFNameID = returned1[0].ID;

var returned2 = await service2.getData();

await Task.Delay(5000);

_selectedLNameID = returned2[0].ID;

listData = await dropdownService.getData();

DropVal = listData[0].ID;

Can you confirm if this is a bug or not?

Thanks and more powers.

[j]

Okay, I vouch the issue is because the items aren't populated yet. There's a workaround though, you need to create a new component put the EjsDropDownList in there and put the service inside the OnInitializedAsync(). There's must be [Parameter] that connects to @bind-Value.

The wrapper component is the one that will use:

<DropDownListDepartments SelectedValue="@selectedVal"></DropDownListDepartments>

[Sevvandhi Nagulan]

Hi j, 

 

Thanks for the patience. 

 

We are glad to announce that our latest release in the version 17.4.0.43 has been rolled out successfully and in that release, we have included the “Default value not being selected while binding the data as complex type”.  So, we suggest you upgrade our Syncfusion packages to our latest version to resolve this issue in your end.  

   

Please find the latest nuget  from the below link.  

   

Nuget Link: https://www.nuget.org/packages/Syncfusion.EJ2.Blazor/17.4.0.43 

Regards, 

Sevvandhi N 

   

[Katie Prodoehl]

Okay, I vouch the issue is because the items aren't populated yet. There's a workaround though, you need to create a new component put the EjsDropDownList in there and put the service inside the OnInitializedAsync(). There's must be [Parameter] that connects to @bind-Value.

The wrapper component is the one that will use:

<DropDownListDepartments SelectedValue="@selectedVal"></DropDownListDepartments>

I am still having this issue even with the latest release.  

I wait to assign the bind-value AFTER the task is completed to get the dropdown values in OnInitializedAsync, but still doesn't populate it.

[Sevvandhi Nagulan]

Hi Katie, 

We checked the reported requirement by initializing the bind-value in the OnInitializedAsync. Please refer the below code and sample, 

protected override async Task OnInitializedAsync() 

    { 

        DataSource = await ownservice.GetDataAsync(); 

        this.val = await ownservice.GetPreSelectDataAsync(); 

    } 

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/BlazorApp3-637159953 

If still issue persists, kindly modify the above sample to replicate the issue or share the issue reproducing sample to proceed further. 

Regards, 

Sevvandhi N