Passing multiple result sets to a view from a controller in ASP.NET MVC?

Question

So I have a controller set up as follows:

using NonStockSystem.Models;

namespace NonStockSystem.Controllers
{
    [Authorize(Users = "DOMAIN\\rburke")]
    public class AdminController : Controller
    {    
        private NonStockSystemDataContext db = new NonStockSystemDataContext();

        public ActionResult Index()
        {
            var enumProducts = from p in db.Products select p;
            ViewData["Title"] = "Administration";
            return View(enumProducts.ToList());
        }
    }
}

The Index view on the Admin controller just lists the products in the system and allows us to click on a product to view / edit / delete it. Really simple. However each product has a CategoryID which tell us which Category it is in which is stored in a separate table.

The (very simplified) current view is this:

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" AutoEventWireup="true" CodeBehind="Index.aspx.cs" Inherits="NonStockSystem.Views.Home.Admin" %>
<%@ Import Namespace="NonStockSystem.Models" %>
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">

<%
foreach (Product p in (IEnumerable)ViewData.Model)
{ %>

    <%=p.Name.ToString() %> (<a href="/Admin/Edit/<%=p.ID.ToString() %>">Edit</a> - <a href="/Admin/Delete/<%=p.ID.ToString() %>">Delete</a>)<br />

<%
} %>   

</asp:Content>

This is fine at the moment as there are only 10 or 15 products in the system whilst I develop and test it however once I deploy it there will be approx. 300 products in the database. I'm fine with displaying them all on one page however I'd like to use (a href="#category") links much like Wikipedia does so at the top of the page I can have the list of categories and when you click one it brings you to the appropriate section of the page. So, my view in that case will look like so:

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" AutoEventWireup="true" CodeBehind="Index.aspx.cs" Inherits="NonStockSystem.Views.Home.Admin" %>
<%@ Import Namespace="NonStockSystem.Models" %>
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">

<ul>
<%
foreach (Category c in (IEnumerable)ViewData.Model)
{ %>
    <li><a href="#<%=c.Name.ToString() %>"><%=c.Name.ToString() %></a></li>
<%
} %>
</ul>

<hr />

<%
foreach (Category c in (IEnumerable)ViewData.Model)
{ %>
    <% // Display the category name above all products from that category %>
    <h2><a name="<%=c.Name.ToString() %>"><%=c.Name.ToString() %></a></h2>

    <% // Need to limit the following foreach to grab only products in this category
    foreach (Product p in (IEnumerable)ViewData.Model)
    { %>
     <%=p.Name.ToString() %> (<a href="/Admin/Edit/<%=p.ID.ToString() %>">Edit</a> - <a href="/Admin/Delete/<%=p.ID.ToString() %>">Delete</a>)<br />
    <%
    } %>
} %>

</asp:Content>

Firstly, I'm not entirely sure this is the "right" way to do this so I'm definitely open to suggestions of a different way of doing things but if this is the way to go then I need to know how to (1) pass two result sets to the view (Products and Categories) and (2) loop through a subset of the Products in each foreach loop grabbing only the ones in the appropriate category?

Cheers!

Answer 1

You have two alternatives. First, you can create a view-only model that consists of both the Products and Categories collections. Second, you can have one or both of the models be passed in ViewData instead of set as the Model for the page.

public class CategoryProduct
{
    public IEnumerable<Product> Products { get; set; }
    public IEnumerable<Category> Categories {get; set; }
}

....

return View( new CategoryProduct { Products = products,
                                   Categories = categories } );

This allows you to use the strongly typed view model and get intellisense, but costs an extra class that you need to maintain.

or (one option)

ViewData["categories"] = categories;
return View( products );

This requires casting the ViewData for Categories so you can use it strongly typed. Products in this case is the model. You could swap these or put both in ViewData.

As far as your approach, I'm okay with it. One alternative would be to make it paged so that not all categories exist on the same page to keep the page length down. You'd still have all the categories listed at the top, but some might require a postback instead to get a new page of data. This is probably a little complicated but will speed up load time when the number of products grows. Another way to do it is using a drilldown. First choose a category, then only products in that category display. These could also be paged. I think this is more typically the way sites like Amazon, Buy.com, etc. do it. They also allow additional filtering (category being only the top level).