How do I build an enumerable viewmodel for MVC?

Question

I'm trying to build an enumerable ViewModel for a user index, but when I build the project, I'm not able to enumerate through the ViewModel. Can someone help me figure out how to build my ViewModel correctly?

My UserProfileIndexViewModel

public class UserProfileIndexViewModel
{
    public List<int> UserId { get; set; }
    public List<string> UserName { get; set; }
    public List<string> FirstName { get; set; }
    public List<string> LastName { get; set; }
    public List<string> Email { get; set; }
    public List<string> ClientName { get; set; }
}

My Controller

public ActionResult Index()
{
    var viewModel = new UserProfileIndexViewModel();
    var users = db.UserProfiles;

    foreach (var user in users)
    {
        viewModel.UserId.Add(user.UserId);
        ProfileBase _userProfile = ProfileBase.Create(user.UserName);
        viewModel.FirstName.Add(Convert.ToString(_userProfile.GetPropertyValue("FirstName")));
        viewModel.LastName.Add(Convert.ToString(_userProfile.GetPropertyValue("LastName")));
        viewModel.Email.Add(db.User_Contacts.Find(user.UserName).Contact.Email);
        viewModel.ClientName.Add(db.User_Clients.Find(user.UserName).Client.Name);
    }
    return View(viewModel);
}

My Index

@model IEnumerable<project.ViewModels.UserProfileIndexViewModel>
@{
    ViewBag.Title = "Index";
}
<p>@Html.ActionLink("Create New", "Create")</p>
<table class="table table-condensed">
    <tr>
        <th>@Html.ActionLink("Create", "Create", "User")</th>
        <th>Username</th>
        <th>First Name</th>
        <th>Last Name</th>
        <th>Email</th>
        <th>Client</th>
    </tr>
@foreach (var item in Model) {
    <tr>
        <td>
            <a href="Details/@item.UserId" title="Details">Details</a>
            <a href="Edit/@item.UserId" title="Edit">Edit</a>
            <a href="Delete/@item.UserId" title="Delete">Delete</a>
        </td>
        <td>@item.UserName</td>
        <td>@item.FirstName</td>
        <td>@item.LastName</td>
        <td>@item.Email</td>
        <td>@item.ClientName</td>
    </tr>
}
</table>

Answer 1

Each user profile contains a single user id, username, first name, etc. so the model should look like this:

public class UserProfileIndexViewModel
{
    public int UserId { get; set; }
    public string UserName { get; set; }
    public string FirstName { get; set; }
    public string LastName { get; set; }
    public string Email { get; set; }
    public string ClientName { get; set; }
}

And your controller action should look like this:

var users = db.UserProfiles;
var viewModel = new List<UserProfileIndexViewModel>();
foreach (var user in users)
{
    ProfileBase _userProfile = ProfileBase.Create(user.UserName);
    viewModel.Add(new UserProfileIndexViewModel {
        UserId = user.UserId,
        FirstName  = Convert.ToString(_userProfile.GetPropertyValue("FirstName")),
        LastName = Convert.ToString(_userProfile.GetPropertyValue("LastName")),
        Email = db.User_Contacts.Find(user.UserName).Contact.Email,
        ClientName = db.User_Clients.Find(user.UserName).Client.Name
    });
}
return View(viewModel);

And then your view should would pretty much as it is now.