IList for model binding in MVC4

Question

In my MVC4 application I have an admin part. In this admin view I can see all the not (yet) accepted users who have registered. This view is also an editor for the ienumerable. To have an editor for an IEnumerable, I have added IList and for-loop like this in my view:

@model IList<PlusPlatform.Models.UserProfile>

@{
    ViewBag.Title = "Manage";
}

<h2>@ViewBag.Title</h2>
@using (Html.BeginForm())
{
    <table>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.UserName)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.FirstName)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.LastName)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.DepartmentId)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.IsActivated)
            </th>
        </tr>

@for (var i = 0; i < Model.Count(); i++) {
    <tr>
        <td>
            @Html.EditorFor(modelItem => Model[i].UserName)
        </td>
        <td>
            @Html.EditorFor(modelItem => Model[i].FirstName)
        </td>
        <td>
            @Html.EditorFor(modelItem => Model[i].LastName)
        </td>
        <td>
            @Html.EditorFor(modelItem => Model[i].DepartmentId)
        </td>
        <td>
            @Html.EditorFor(modelItem => Model[i].IsActivated)
        </td>
    </tr>
}
</table>
<input type="submit" value="Save" />
}

But now the problem is I can't use the Html.DisplayNameFor and the Html.LabelFor. What can I do to display the labels correctly?

Answer 1

If you don't really care about the IList<T>, you can change your model to IEnumerable<T>. DisplayNameFor method has an overload for IEnumerable, that means you will be able to do this:

@model IEnumerable<PlusPlatform.Models.UserProfile>
...
<th>
    @Html.DisplayNameFor(model => model.UserName)
</th>

LabelFor doesn't have this overload, because label should be used for a specific element, such as:

@Html.LabelFor(modelItem => Model[i].UserName)

EDIT:

If you wan to post that data to controller, better create an EditorTemplate, name it UserProfile:

@model PlusPlatform.Models.UserProfile
<tr>
    <td>
        @Html.EditorFor(m=> m.UserName)
    </td>
    <td>
        @Html.EditorFor(m=> m.FirstName)
    </td>
    <td>
        @Html.EditorFor(m=> m.LastName)
    </td>
    <td>
        @Html.EditorFor(m=> m.DepartmentId)
    </td>
    <td>
        @Html.EditorFor(m=> m.IsActivated)
    </td>
</tr>

Then in the View get rid of the loop:

@model IEnumerable<PlusPlatform.Models.UserProfile>
@using (Html.BeginForm())
{
    <table>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.UserName)
            </th>
            ...
        </tr>
        @Html.EditorForModel()
    </table>
 }

Answer 2

If you can use EditorFor in that way, then why not DisplayFor? Try this

  @Html.LabelFor(modelItem => Model[0].FirstName)

Answer 3

Try like this

@using (Html.BeginForm())
{
    <table>
        <tr>
            <th>
                <label@Html.DisplayNameFor(m =>m.First().UserName)</label>
            </th>
            <th>
                <label>@Html.DisplayNameFor(m =>m.First().FirstName)</label>
            </th>
            <th>
               <label>@Html.DisplayNameFor(m =>m.First().LastName)</label>
            </th>
            <th>
                <label>@Html.DisplayNameFor(m =>m.First().DepartmentId)</label>
            </th>
            <th>
               <label>@Html.DisplayNameFor(m =>m.First().IsActivated)</label>
            </th>
        </tr>

@for (var i = 0; i < Model.Count(); i++) {
    <tr>
        <td>
            @Html.EditorFor(modelItem => Model[i].UserName)
        </td>
        <td>
            @Html.EditorFor(modelItem => Model[i].FirstName)
        </td>
        <td>
            @Html.EditorFor(modelItem => Model[i].LastName)
        </td>
        <td>
            @Html.EditorFor(modelItem => Model[i].DepartmentId)
        </td>
        <td>
            @Html.EditorFor(modelItem => Model[i].IsActivated)
        </td>
    </tr>
}