Selecting a list item does not put the value in the control's box

[David Adler]

I am using SyncFusion.Blazor v18.1.0.43

I have an SfDropDownList control with the DataManager. The code from the razor page is below.

<SfDropDownList id="stateProvinceCode" CssClass="adjust-sf-padding" TValue="string" TItem="StateProvinceModel" @bind-Value="@CreateAccountBasicInfo.StateProvinceCode" Query="@StatesProvincesQuery">

<SfDataManager Headers="@HeaderData" Url="@StatesProvincesUrl" Adaptor="Adaptors.ODataV4Adaptor"></SfDataManager>

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

</SfDropDownList>

The list populates correctly when the popup is displayed but when I select an item from the list, the items value doesn't appear in the controls box.

Here is my StateProvinceModel class;

    public class StateProvinceModel

    {

        public string Id { get; set; }

        public string Name { get; set; }

        public string CountryCode { get; set; }

    }

Here is my CreateAccountBasicInfo class;

    public class CreateAccountBasicInfoModel

    {

        public string AccountName { get; set; }

        public string PhoneNumber { get; set; }

        public string Fax { get; set; }

        public string PrimaryAddress { get; set; }

        public string SecondaryAddress { get; set; }

        public string City { get; set; }

        public string StateProvinceCode { get; set; }

        public string PostalCode { get; set; }

        public string CountryRegionCode { get; set; }

    }

Here is my Query as defined in my razor.cs page;

        protected Query StatesProvincesQuery = new Query().Select(new List<string> { "Id", "Name" });

I have attached a screenshot of the DropDownList popup showing the populated  list.

What am I missing?

Attachment: SyncFusion_Screenshots_eac164b5.zip

[Sevvandhi Nagulan]

Hi David, 

 

Greetings from Syncfusion support. 

 

We checked the reported issue by using the shared code snippet. We could not replicate the issue.  While selecting the value, the selected value updated to the component. Kindly refer the below code and sample, 

 

<SfDropDownList id="stateProvinceCode" CssClass="adjust-sf-padding" TValue="string" TItem="OrderDetails" @bind-Value="@CreateAccountBasicInfo.StateProvinceCode" Query="@StatesProvincesQuery"> 

    <SfDataManager Url="@StatesProvincesUrl" Adaptor="Syncfusion.Blazor.Adaptors.ODataV4Adaptor"></SfDataManager> 

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

</SfDropDownList> 

 

@code { 

    protected Query StatesProvincesQuery = new Query().Select(new List<string> { "OrderID", "CustomerID" }); 

    public string StatesProvincesUrl = "https://services.odata.org/V4/Northwind/Northwind.svc/Orders"; 

 

    public CreateAccountBasicInfoModel CreateAccountBasicInfo = new CreateAccountBasicInfoModel(); 

 

    public class CreateAccountBasicInfoModel 

    { 

        public string AccountName { get; set; } 

        public string PhoneNumber { get; set; } 

        public string Fax { get; set; } 

        public string PrimaryAddress { get; set; } 

        public string SecondaryAddress { get; set; } 

        public string City { get; set; } 

        public string StateProvinceCode { get; set; } 

        public string PostalCode { get; set; } 

        public string CountryRegionCode { get; set; } 

    } 

 

 

} 

<SfDropDownList id="stateProvinceCode" CssClass="adjust-sf-padding" TValue="string" TItem="OrderDetails" @bind-Value="@CreateAccountBasicInfo.StateProvinceCode" Query="@StatesProvincesQuery"> 

    <SfDataManager Url="@StatesProvincesUrl" Adaptor="Syncfusion.Blazor.Adaptors.ODataV4Adaptor"></SfDataManager> 

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

</SfDropDownList> 

 

@code { 

    protected Query StatesProvincesQuery = new Query().Select(new List<string> { "OrderID", "CustomerID" }); 

    public string StatesProvincesUrl = "https://services.odata.org/V4/Northwind/Northwind.svc/Orders"; 

 

    public CreateAccountBasicInfoModel CreateAccountBasicInfo = new CreateAccountBasicInfoModel(); 

 

    public class OrderDetails 

    { 

        public int? OrderID { get; set; } 

        public string CustomerID { get; set; } 

        public int? EmployeeID { get; set; } 

        public double? Freight { get; set; } 

        public string ShipCity { get; set; } 

        public bool Verified { get; set; } 

        public DateTime? OrderDate { get; set; } 

        public string ShipName { get; set; } 

        public string ShipCountry { get; set; } 

        public DateTime? ShippedDate { get; set; } 

        public string ShipAddress { get; set; } 

    } 

    public class CreateAccountBasicInfoModel 

    { 

        public string AccountName { get; set; } 

        public string PhoneNumber { get; set; } 

        public string Fax { get; set; } 

        public string PrimaryAddress { get; set; } 

        public string SecondaryAddress { get; set; } 

        public string City { get; set; } 

        public string StateProvinceCode { get; set; } 

        public string PostalCode { get; set; } 

        public string CountryRegionCode { get; set; } 

    } 

 

 

} 

Demo Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/BlazorApp11944334872 

Can you please provide the below details to proceed further? 

1.       Provide the sufficient code to replicate the issue 

2.       Provide Issue reproducing sample 

3.       If possible modify the above sample to replicate the issue 

Regards, 

Sevvandhi N 

[David Adler]

It turned out that in the line...

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

The Value property should have been Value="Id" instead of Value="ID"

Simple typo. Thanks for your help.

 

[Sevvandhi Nagulan]

Hi David, 

Thanks for the update. 

Please let us know if you need any other further assistance on this. 

Regards, 

Sevvandhi N