Question

I have a viewmodel class for a create view that consists of 2 properties different classes, and a list of selectitems (for dropdownlist). The dropdown list and the fields for one of the classes are always shown in the view,but the fields for the 2nd class are only shown if a specific option of the list is selected. (via a jQuery load and a controller that returns a partial view, strongly typed for the 2nd class)

The fields in the view for the second class are some normal input=text fields and a dropdown list.

When I submit the form, all of the data will be properly binded, except for the values for the list inside the second class.

The problem is that if there is a validation error, and I return the view with the model (to show the errors) then the dropdownlist (the one for the second class) is empty, and since there is no way to choose from it, then the submit will always have isValid=false :S

This is an example of how I have setup things:

I currently have a view model that is looks like the following:

public class ViewModel
{
   public GenericData genericData{get;set;}
   public SpecializedData specializedData {get;set;}
   public List<SelectListItem> types { get; set; }
}

public class GenericData
{
   public Type type {get;set;}
   public String name {get;set;}
   public String description{get;set;}
}
public class SpecializedData
{
   public String field{get;set;}
   public int foreignKey{get;set;}
   public List<SelectListItem> listOfForeignKeys{ get; set; }
}

The view is strongly typed for ViewModel and is setup this way:

<p>
   <label for="genericData.type"> Type:  </label>
        <%=Html.DropDownList("genericData.type",Model.types, "Choose a type") %>
</p>
<p>
    <label for="genericData.name"> Name:</label>
    <%: Html.TextBox("genericData.name")%>
    <%= Html.ValidationMessage("genericData.name", "*")%>
</p>
//Same thing for Description as for name

<div id="SpecializedFields">
           //This will display the specialized info it was already captured before.
           <% if (Model.SpecializedData!= null && Model.GenericData.Type == "Specialized")
           {
               Html.RenderPartial("SpecializedInfoView", Model.specializedData);
           } %>
</div>
<p>
     <input type="submit" value="Create" />
</p>

$(document).ready(function () {
        $("#CatalogItem_Type").change(function () {

            var typeVal = $("#GenericData_type").val();
            if (typeVal == "specialized") {
                $("#SpecializedFields").load("/MyController/SpecializedFields");
            }

the controller will do something like this

public ActionResult SpecializedFields()
{
     List<SelectListItem> foreignIds = getForeignIdsFromDataBase();
     SpecializedData model = new SpecializedData ();
     model.listOfForeignIds = foreignIds;
     return PartialView("SpecializedInfoView",model);
}

Finally, the SpecialezedInfoView is a strongly typed view for SpecializedData and is similar to the generic one, it goes like this:

<p>
   <label for="specializedData.foreignKey"> Key:  </label>    <%=Html.DropDownList("specializedData.foreignKey",Model.listOfForeignKeys, "Choose key") %>
</p>
<p>
    <label for="SpecializedData.field"> Field:</label>
    <%: Html.TextBox("specializedData.field")%>
    <%= Html.ValidationMessage("specializedData.field", "*")%>
</p>

When I click submit, if its not a specialized item, i will get a null for the specializedData property, which is ok. If it is a specialized item, then it will not be null, I’ll get all the properties from the genericData and I’ll get the specializedData.field and specializedData.foreignKey value too, but the specialized.listOfForeignKeys will be a NULL which means that if there is a validation error and i return the view with the current model, then everything will have the previously entered values, BUT the DropDownList with the list of foreign keys will be empty, and there is no way to choose an id now.

I know i could check to see if the specializedData is not null in the method that receives the post, and re-generate the list of keys and assign it to the current model (since it is the only data it is missing), but that would mean having to do extra DB calls, instead of the info being there with the model!

I know it is a long question, but I wanted to be explicit on how I am setting up things, do somebody know why is the listOfForeignKeys not being passed back the the model after postback!?

Thanks!

Answer 1

I figured out… the thing is that values for DropDownLists are NOT sent back to the model when you do I binding… however, since the binding automatically calls the constructor of the viewmodel the List<SelectItemList> Types was being filled there on not really because of the binding. The second list is not built in the constructor, thus it came as null. I added the query to get the information for the list in the SpecializedData constructor, and now its working..

Still it kind of sucks that when the user hits post there will be an extra call to the DB, and more times so if there are validation errors. Maybe I’ll try to do a cache to store the query results, but for the time being, this is enough.

Thanks!