We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Default Value Is Not Being Selected.

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,

8 Replies

SD Saranya Dhayalan Syncfusion Team November 8, 2019 06:12 AM

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: 
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 j January 6, 2020 08:16 AM

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


SP Sureshkumar P Syncfusion Team January 8, 2020 05:58 AM

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 14th January 2020. We appreciate your patience until then.  
 
You can track the status of the reported issue from the below feedback link, 
 
 
Regards, 
Sureshkumar P. 



J j January 13, 2020 07:42 AM

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 j January 13, 2020 10:00 AM

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>


SN Sevvandhi Nagulan Syncfusion Team January 14, 2020 06:04 PM

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.  
   

Regards, 
Sevvandhi N 
   



KP Katie Prodoehl replied to j May 19, 2020 09:20 AM

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.


SN Sevvandhi Nagulan Syncfusion Team May 19, 2020 10:31 PM

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(); 
    } 







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 


Loader.
Live Chat Icon For mobile
Up arrow icon