MVC Razor MultiSelectList获取/设置SelectedValue

Question

I'm using erichynds Multi Select Widget to create a nice style for my MultiSelectList. But my issue (appears) to be unrelated.

I am trying to loop through each DemographicQuestionFilter question, list out the DemographicResponseFilter response and be able to get/post the selected items along with my DemographicFilterViewModel model. The issue I am having is that when I set the filters for item-1 (index 0) in the list it works fine, when I set item-2 (index 1) it only works if item-1 is also set, if item-1 is not set then the DemographicFilters object is null. I'm assuming I can switch up types, or that I'm missing something basic here.

How can I make it so that the list containing the selected items for n Question is not dependent n-1 also having a selected item?

Here are my ViewModel objects:

Parent:

public class DemographicFilterViewModel
{
    public int TaskID { get; set; }
    public List<DemographicQuestionFilter> DemographicFilters { get; set; }
}

Child:

public class DemographicQuestionFilter
{   
    public string Question { get; set; }

    public List<DemographicResponseFilter> Responses { get; set; }

    public List<SelectListItem> selectListItems { get; set; }

    public List<int> SelectedItems { get; set; }
}

Grandchild:

public class DemographicResponseFilter
{
    public int ResponseID { get; set; }
    public string Response { get; set; }
}

View:

@Html.HiddenFor(m => m.TaskID)
if (Model.DemographicFilters != null)
{
    for (int i = 0; i < Model.DemographicFilters.Count; i++)
    {
        @Html.HiddenFor(model => model.DemographicFilters[i].SelectedItems)
        @Html.DisplayTextFor(m => m.DemographicFilters[i].Question)
        <br />
        @Html.ListBoxFor(model => model.DemographicFilters[i].SelectedItems, new MultiSelectList(Model.DemographicFilters[i].Responses, "ResponseID", "Response", Model.DemographicFilters[i].SelectedItems),  new { Multiple = "multiple" })
        <br />
        <br />
    }
}

Here is what is rendered to the screen (just so you can try to follow what I am doing): http://i.imgur.com/ZefpLy1.png?1

Edit: The issue is when the View posts back to the controller, the View displays correctly, but on HttpPost the values in [n]SelectedItems are dependent on [n-1]SelectedItems having a value,

If [i]SelectedItems is blank (nothing selected) then every [>i]SelectedItems is null, even when the values are correctly set in the HttpGet...

HTMLHelper Extension:

#region Usings

using System;
using System.Collections.Generic;
using System.Linq.Expressions;
using System.Web.Mvc.Html;
using System.Web.Mvc;

#endregion

namespace Extensions
{
    public static class HtmlHelperExtensions
    {
        public static MvcHtmlString HiddenEnumerableFor<TModel, TEnumType>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, IEnumerable<TEnumType>>> expression)
        {
            return htmlHelper.Hidden(htmlHelper.NameFor(expression).ToHtmlString(),
                string.Join(",", expression.Compile().Invoke(htmlHelper.ViewData.Model) ?? new TEnumType[0]));
        }
    }
}

Answer 1

HiddenFor cannot be used for ListBoxFor so here is the workaround I tried to fix the issue.

Replaced

  @Html.HiddenFor(model => filter.SelectedItems)

With

  @Html.Hidden(string.Format("DemographicFilters[{0}].SelectedItems", i), "-1")

Problem with this approach is that your DemographicFilters.SelectedItems will have an extra row -1 added to it, need to add code to exclude -1 row.

Answer 2

My answer is an extension on what Vasanth Sundaralingam posted in his answer, that HiddenFor won't work with arrays. I went ahead and created a function that behaves like a hiddenFor for enumerable properties.

@functions
{
    public MvcHtmlString HiddenEnumerableFor<TModel, TEnumType>(
        HtmlHelper<TModel> htmlHelper,
        Expression<Func<TModel, IEnumerable<TEnumType>>> expression) 
    {

        return htmlHelper.Hidden(htmlHelper.NameFor(expression).ToHtmlString(),
            string.Join(",", expression.Compile().Invoke(htmlHelper.ViewData.Model) ?? new TEnumType[0]));
    }
}

Replace

@Html.HiddenFor(model => filter.SelectedItems)

With

@HiddenEnumerableFor(Html, m => m.DemographicFilters[i].SelectedItems)

You could also convert this into an extension method by adding it to a static class, and adding this before the first parameter. That way it would look like very similar to HiddenFor

@Html.HiddenEnumerableFor(m => m.DemographicFilters[i].SelectedItems)