Problem with MVC EditorFor named template

Question

I have what appears (to me anyway) to be a strange problem...

I created a simple editor template for a SelectListItem (SelectListItem.cshtml in the ~/Views/Shared/EditorTemplates folder), for example:

<ul class="select-list-item cell-15 col-3 omega clearfix">
    @Html.EditorFor(c => c.Categories)
</ul>

Where c.Categories is an IEnumerable

This worked fine, but I wanted another template to render the collection with slightly different markup, so I copied and renamed the editor template to, for example, 'CategoryIcons.cshtm' and invoked as follows:

<ul class="select-list-item cell-15 col-3 omega clearfix">
    @Html.EditorFor(c => c.Categories, "CategoryIcons")
</ul>

In short, the only difference is I'm specifying a named editor template.

When I open the page, I now get the following error:

The model item passed into the dictionary is of type 'System.Collections.Generic.List`1[System.Web.Mvc.SelectListItem]', but this dictionary requires a model item of type 'System.Web.Mvc.SelectListItem'

The template's model declaration, in both templates id:

@model System.Web.Mvc.SelectListItem

I don't understand why the default template works and the named template doesn't. Any help would be appreciated.

Thanks.

Azimuth

Answer 1

When you call @Html.EditorFor(c => c.Categories) it is falling back to the default template for IEnumerable. This default template is provided by the MVC framework, and its behaviour is to output Html.EditorFor() for each item in the enumeration. That in turn emits the appropriate editor template for each item in the list individually - in your case they're all instances of SelectListItem, so in the first case, the SelectListItem template is used for each item.

In the second case, by explicitly setting your EditorFor to use a particular editor template CategoryIcons, you are telling it to use that editor template for the whole enumeration, instead of allowing the enumerable to be templated by default, in turn using the template for each enumerated item.

I'm not sure of the best way around this just yet.

One approach would be to define a CategoryIcons template, whose model is an instance of IEnumerable<CategoryIcon>, which simply foreaches the Model enumeration, and performs Html.EditorFor for each item, with an explicit template reference of CategoryIcon. You then put your per-item editor template in that template (CategoryIcon not CategoryIcons). You would then call this by doing @Html.EditorFor(c => c.Categories, "CategoryIcons").

I'm going to have a look around to see if there are better ways to get this done, but I hope this might be useful for now. It would be great if templates could be parameterized, so you could write an IEnumerable template that takes as an argument the name of the template to use for each of its items.

Esbjerg

I was writing the exact same response, the only other thing I will add is that you can wrap SelectListItem with a class of any other name and use that to get a different template, but in either case, this is probably a good place for someone looking to add to MVCContrib to start. – Shrove

Thanks for the explanation and advice. I created a new class by inheriting from SelectListItem and then created a new template for that class - it works perfectly, but does seem like an unnecessary overhead. – Azimuth

Answer 2

Just an update, I stumbled on this question trying to address the same issue myself.

What I ended up doing was iterating through each instance of the collection and calling the EdtorFor individually, sort of like this:

<ul class="select-list-item cell-15 col-3 omega clearfix">
    @for (int i=0;i<Model.Categories.Count;i++) {
        @Html.EditorFor(c => c.Categories[i], "CategoryIcons")
    }
</ul>

Still not clean, but I like it better than inheriting a new class like you ended up doing.

(Sorry if my C# syntax is a little off, I write in vb.net)

Rone

Thank Ben, I think this solution is much easier - particularly if you are only dealing with one instance of the model. This was not the case for me, and I felt that in my particular application creating a new class actually allowed me to add some additional methods and properties to the data. A case of 'horses for course' I guess - thank you for your post - much appreciated. – Azimuth

Answer 3

If you're using EditorFor, I don't think the looping solution will work. It seems that using the IEnumerable template is the only way for the form inputs to be named correctly; if you just call EditorFor repeatedly, then your form <INPUT>s will have the same ID, rather than indexed IDs.

I experienced this issue and the solution was to emit the enumerable template and not loop through the list items.

Sorry to make this an answer not a comment -- don't have commenting rights.

Whereinto