Question

I have a model that contains a dictionary property. (this has been distilled from a larger project into this example, which I have confirmed still has the same issue)

public class TestModel
{
    public IDictionary<string, string> Values { get; set; }

    public TestModel()
    {
        Values = new Dictionary<string, string>();
    }
}

a controller

public class TestController : Controller
{
    public ActionResult Index()
    {
        TestModel model = new TestModel();
        model.Values.Add("foo", "bar");
        model.Values.Add("fizz", "buzz");
        model.Values.Add("hello", "world");

        return View(model);
    }

    [HttpPost]
    public ActionResult Index(TestModel model)
    {
        // model.Values is null after post back here.
        return null; // I set a break point here to inspect 'model'
    }
}

and a view

@using TestMVC.Models
@model TestModel
@using (Html.BeginForm())
{
    @Html.EditorFor(m => m.Values["foo"]);
    <br />
    @Html.EditorFor(m => m.Values["fizz"]);
    <br />
    @Html.EditorFor(m => m.Values["hello"]);
    <br />
    <input type="submit" value="submit" />
}

This renders to the browser like this:

<input class="text-box single-line" id="Values_foo_" name="Values[foo]" type="text" value="bar" />

The problem I’m having is that the dictionary is null on the model after postback.

• Am I doing this right, or is there a better way?

I need to have some kind of key-value storage, as the fields on my form are variable, so I can’t use a POCO model.

Answer 1

As @Blast_Dan and @gprasant mentioned, the model binder is expecting the name attribute of the input element to be in the format Property[index].Value, where index is an int and Value is one of the properties on the KeyValuePair class.

Unfortunately, @Html.EditorFor generates this value in the wrong format. I wrote an HtmlHelper extension to transform the name attribute to the correct format:

public static IHtmlString DictionaryEditorFor<TModel, TProperty, TKey, TValue>(this HtmlHelper<TModel> Html, Expression<Func<TModel, TProperty>> expression, IDictionary<TKey, TValue> dictionary, DictionaryIndexRetrievalCounter<TKey, TValue> counter, string templateName, object additionalViewData)
{
    string hiddenKey = Html.HiddenFor(expression).ToHtmlString();
    string editorValue = Html.EditorFor(expression, templateName, additionalViewData).ToHtmlString();
    string expText = ExpressionHelper.GetExpressionText(expression);
    string indexText = expText.Substring(expText.IndexOf('[')).Replace("[", string.Empty).Replace("]", string.Empty);

    KeyValuePair<TKey, TValue> item = dictionary.SingleOrDefault(p => p.Key.ToString() == indexText);
    int index = counter.GetIndex(item.Key);

    string key = hiddenKey.Replace("[" + indexText + "]", "[" + index + "].Key").Replace("value=\"" + item.Value + "\"", "value=\"" + item.Key + "\"");

    string value = editorValue.Replace("[" + indexText + "]", "[" + index + "].Value");

    return new HtmlString(key + value);
}

Because the integer index must follow these rules:

1. Must start with 0

2. Must be unbroken (you can’t skip from 3 to 5, for example)

I wrote a counter class to handle getting the integer index for me:

public class DictionaryIndexRetrievalCounter<TKey, TValue>
{
    private IDictionary<TKey, TValue> _dictionary;
    private IList<TKey> _retrievedKeys;

    public DictionaryIndexRetrievalCounter(IDictionary<TKey, TValue> dictionary)
    {
        this._dictionary = dictionary;
        this._retrievedKeys = new List<TKey>();
    }

    public int GetIndex(TKey key)
    {
        if (!_retrievedKeys.Contains(key))
        {
            _retrievedKeys.Add(key);
        }

        return _retrievedKeys.IndexOf(key);
    }
}