Html.DropDownListFor binding for complex child object

Question

I have the following code (ASP.NET MVC/C#)...simplifying some for brevity.

public class UserViewModel
{
   public int UserId { get; set; }
   public string Name { get; set; }
   public AddressViewModel Address { get; set; }

   public IEnumerable CitySelectList { get; set; }
}

public class AddressViewModel
{
   public int AddressId { get; set; }
   public string StreetAddress { get; set; }
   public int CityId { get; set; }
}

In the razor view I have the following:

@Html.DropDownListFor(x => x.Address.CityId, Model.CitySelectList)

The right city is selected in the dropdown at load time (ie...the original value) so that works fine, but when I submit the form, the CityId property is not updated with the newly selected value....it still contains the original city's id.

I added a new property to the UserViewModel called "SelectedCityId" and bound that to the dropdownlist like this to test the complex nested object being the problem:

@Html.DropDownListFor(x => x.SelectedCityId, Model.CitySelectList)

When I submit the form using this method, the SelectedCityId does contain the right id so I can see model binding working properly when the object is a simple object, but not when it's a nested child object.

Just for troubleshooting, I checked the postal code field as it also binds to a child property of the Address class, but it does bind properly when using the similar TextBoxFor helper:

@Html.TextBoxFor(x => x.Address.PostalCode)

So, my question is why does model binding not seem to work with the DropDownListFor helper when the expression ties the control to a nested child property? I'm sure its something trivial that I am missing, but I'm not seeing what it is and haven't found a similar answer here.

EDIT: Here is the entire html form from the cshtml file

@using (Html.BeginForm("MyProfile", "Account", FormMethod.Post, new { id = "myProfileForm" }))
        {
            @Html.HiddenFor(x => x.UserId)
            @Html.HiddenFor(x => x.AddressId)
            @Html.HiddenFor(x => x.Address.CityId)

            
                Personal details
                
                    


                E-mail:
                    @Model.Username
                        
                        
                            New Email:
                            @Html.TextBoxFor(x => x.Username, new { id = "new_email" })
                            
                            Cancel
                        
                        
                    
                    
                
                
                    First name:
                    @Model.FirstName
                        
                        
                            New First Name:
                            @Html.TextBoxFor(x => x.FirstName, new { id = "new_name" })
                            
                            Cancel
                        
                        
                    
                    Edit
                
                
                    Last name:
                    @Model.LastName
                        
                        
                            New Last Name:
                            @Html.TextBoxFor(x => x.LastName, new { id = "new_last_name" })
                            
                            Cancel
                        
                        
                    
                    Edit
                
                
                    Display name:
                    @Model.DisplayName
                        
                        
                            New Display Name:
                            @Html.TextBoxFor(x => x.DisplayName, new { id = "new_display_name" })
                            
                            Cancel
                        
                        
                    
                    Edit
                
                
                    Password:
                    
                        
                        
                            New Password:
                            @Html.PasswordFor(x => x.Membership.Password, new { id = "new_password" })
                            
                            Cancel
                        
                        
                    
                    
                
                
                    Cell phone:
                    @Model.CellPhone
                        
                        
                            New Cell Phone:
                            @Html.TextBoxFor(x => x.CellPhone, new { id = "new_cell" })
                            
                            Cancel
                        
                        
                    
                    Edit
                
                
                    Home phone:
                    @Model.HomePhone
                        
                        
                            New Home Phone:
                            @Html.TextBoxFor(x => x.HomePhone, new { id = "new_home" })
                            
                            Cancel
                        
                        
                    
                    Edit
                
                
                    Street Address:
                    @(Model.Address != null ? Model.Address.Address1 : "No address given")
                        
                        
                            New Address:
                            @Html.TextBoxFor(x => x.Address.Address1, new { id = "new_address" })
                            
                            Cancel
                        
                        
                    
                    Edit
                

                
                    Town / City:
                    @(Model.Address != null ? Model.Address.City.Name : "No address given")
                        
                        
                            New City:
                            @Html.DropDownListFor(x => x.Address.CityId, Model.CitySelectList, new { @class = "f-item" })
                            
                            Cancel
                        
                        
                    
                    Edit
                

                
                    Postal Code:
                    @(Model.Address != null ? Model.Address.PostalCode : "No address given")
                        
                        
                            New Postal Code:
                            @Html.TextBoxFor(x => x.Address.PostalCode, new { id = "new_zip" })
                            
                            Cancel
                        
                        
                    
                    Edit
                

                
                    First Admin Division (State):
                    @(Model.Address != null ? Model.Address.City.FirstAdminDivision.Name : "No address given")
                        
                        
                            New First Admin Division (State):
                            
                            
                            Cancel
                        
                        
                    
                    Edit
                

                
                    Country:
                    @(Model.Address != null ? Model.Address.City.FirstAdminDivision.Country.Name : "No address given")
                        
                        
                            New Country:
                            
                            
                            Cancel
                        
                        
                    
                    Edit
                
            

        
    }

And the two controller actions:

public ActionResult MyProfile()
        {
            IAccountService accountSvc = GetService();
            UserProfileServiceRequest request = new UserProfileServiceRequest();

            int userId = int.Parse(SessionMgr.GetInstance().GetSessionValue(SessionTypes.UserId).ToString());

            if (userId == 0)
            {
                return RedirectToAction("Login", "Account");
            }
            else
            {
                request.UserId = userId;
                UserProfileServiceResponse response = accountSvc.GetUserProfile(request);
                UserProfileViewModel model = AutoMapper.Mapper.Map(response.UserProfile);

                ICommonService commonSvc = GetService();
                GetCitiesServiceRequest citiesRequest = new GetCitiesServiceRequest { FirstAdminDivisionId = model.Address.City.FirstAdminDivision.FirstAdminDivisionId };
                KeyValuePairServiceResponse citiesResponse = commonSvc.GetCitiesForSelect(citiesRequest);
                model.CitySelectList = citiesResponse.KeyValuePairs.ToSelectList();

                List roles = (List)SessionMgr.GetInstance().GetSessionValue(SessionTypes.Roles);
                RoleViewModel consumerRole = roles.FirstOrDefault(x => x.Meaning.Equals(DataEnumerations.GetRoleMeaning(DataEnumerations.Role.Consumer)));

                if (consumerRole != null)
                {
                    GetConsumerTripsServiceRequest consumerTripsRequest = new GetConsumerTripsServiceRequest() { UserId = userId };
                    GetConsumerTripsServiceResponse consumerTripsResponse = commonSvc.GetConsumerTrips(consumerTripsRequest);
                    model.ConsumerTrips = AutoMapper.Mapper.Map>(consumerTripsResponse.Trips);

                    GetUserReviewsServiceRequest userReviewsRequest = new GetUserReviewsServiceRequest() { UserId = userId };
                    GetUserReviewsServiceResponse userReviewsResponse = commonSvc.GetUserReviews(userReviewsRequest);
                    model.UserReviews = AutoMapper.Mapper.Map>(userReviewsResponse.UserReviews);
                }

                return View(model);
            }
        }

[HttpPost]
        public ActionResult MyProfile(UserProfileViewModel model)
        {
            UpdateUserProfileServiceRequest request = AutoMapper.Mapper.Map(model);

            IAccountService accountSvc = GetService();
            accountSvc.UpdateUserProfile(request);

            return RedirectToAction("MyProfile", "Account");

        }

The entire AddressViewModel class:

public class AddressViewModel
    {
        public Int32 AddressId { get; set; }
        public String Address1 { get; set; }
        public String Address2 { get; set; }
        public Int32 CityId { get; set; }
        public String PostalCode { get; set; }

        public CityViewModel City { get; set; }

    }

And the entire UserProfileViewModel:

public class UserProfileViewModel : BaseViewModel
    {
        public int UserId { get; set; }
        public string Username { get; set; }
        public string FirstName { get; set; }
        public string LastName { get; set; }
        public string DisplayName { get; set; }
        public string CellPhone { get; set; }
        public string HomePhone { get; set; }
        public int AddressId { get; set; }

        public AddressViewModel Address { get; set; }
        public MembershipViewModel Membership { get; set; }

        public List ConsumerTrips { get; set; }

        public List UserReviews { get; set; }

        public IEnumerable CitySelectList { get; set; }
        public int SelectedCityId { get; set; }
    }

user3559349 · Accepted Answer

Your form includes a hidden input for the property in addition to a dropdown list

@Html.HiddenFor(x => x.Address.CityId)
....
@Html.DropDownListFor(x => x.Address.CityId, Model.CitySelectList, ..)

In effect you are passing back 2 values for the same property. The DefaultModelBinder reads the first (from the hidden input which is the original value) and sets the value of Address.CityId. Any subsequent values for the same property (from the dropdown list) are ignored.

Remove the hidden input and you model will be correctly bound with the selected value.

Html.DropDownListFor binding for complex child object

Answers (1)

Related Questions