1. Create a new MVC application.

2. Then we will create a quick model to play with. We need two distinctly different models to be able to demonstrate why we would need to render one action from within another. We will create a Post class to represent some blog posts. And we will create a Product class to represent a list of suggested products, which we will display next to our blog posts.

Models/Post.cs:

public class Post
{
public DateTime Created { get; set; }
public string Title { get; set; }
public string Body { get; set; }
}

Models/Product.cs:

public class Product
{
public string Name { get; set; }
public string Description { get; set; }
public double Cost { get; set; }
}

3. Then we need to create a couple of service classes from which we will generate a list of our new object models. We will create a ProductService class and a BlogService class. Each of these classes will have Get methods on them to get a list of the specific objects we need.

Models/BlogService.cs:

public class BlogService
{
public List<Post> GetPosts(int count)
{
List<Post> result = new List<Post>();
for (int i = 0; i < count; i++)
{
Post p = new Post();
p.Created = DateTime.Now;
p.Title = "A really great post";
p.Body = @"Lorem ipsum dolor sit amet, ...";
result.Add(p);
}
return result;
}
}

Models/ProductService.cs:

public class ProductService
{
public List<Product> GetProducts(int count)
{
List<Product> result = new List<Product>();
Random r = new Random();
for (int i = 0; i < count; i++)
{
Product p = new Product();
p.Cost = r.Next(5, 50);
p.Name = "Really great product";
p.Description = @"Lorem ipsum ...";
result.Add(p);
}
return result;
}
}

4. Now that we have the ability to generate a list of working data, we can next turn our attention to creating two controllers to handle views for each of our two object types. We will create a BlogController and a ProductController. The BlogController will expose an Index action to show a list of recent blog posts. The ProductController will have a SuggestedProducts action that will return a list of products.

Models/BlogController.cs:

public class BlogController : Controller
{
public ActionResult Index()
{
return View(new BlogService().GetPosts(5));
}
}

Models/ProductController.cs:

public class ProductController : Controller
{
public ActionResult SuggestedProducts()
{
return View(new ProductService().GetProducts(7));
}
}

5. The next thing for us to do is to generate a view for each of our controllers. We will start with the ProductController, as its view is the easiest. For this controller, we will generate a strongly typed partial view based on a Product using the details view. Once the view is generated, we have to change the model from a single instance of Product to a List of Product. Then we need to wrap the details view that was generated with a loop.

Views/Product/SuggestedProducts.aspx:

<%@ Page Title="" Language="C#" Inherits= "System.Web.Mvc.ViewPage<List<MvcApplication1.Models.Product>>" %>
<%@ Import Namespace="MvcApplication1.Models" %>
<fieldset>
<legend>Suggested Products</legend>
<% foreach (Product p in Model) { %>
<div class="display-field"><b><%: p.Name%></b></div>
<div class="display-field">
<i><%: String.Format("{0:C}", p.Cost)%></i>
</div>
<div class="display-field"><%: p.Description%></div>
<% } %>
</fieldset>

6. Now we need to generate our primary view, which will be responsible for showing a list of blog posts. In addition to displaying blog posts, we will also render the list of suggested products. Similar to our previous view, we will start by generating the view from the Index action of the BlogController. This will be a strongly typed details view based on the Post class. Once it is generated, we will need to wrap the generated view code with a table so that the list of blog posts can sit next to a list of suggested products. I also added a bit of styling to get things to line up a bit better.

Views/Blog/Index.aspx:

<h2>My Blog</h2>
<table style="width:800px;">
<tr>
<td style="width:200px;vertical-align:top;">
<!-- Suggested products... -->
</td>
<td style="vertical-align:top;">
<fieldset>
<legend>Recent Posts</legend>
<%
foreach (Post p in Model)
{ %>
<div class="display-field"><b><%: p.Title%></b></div>
<div class="display-field"><i>
<%: String.Format("{0:g}", p.Created)%></i></div>
<div class="display-field"><%= p.Body%></div>
<% } %>
</fieldset>
</td>
</tr>
</table>

7. Now that we have our primary view created, we can turn our attention to rendering a list of suggested products. All that we need to do is add a call to Html.RenderAction where we currently have this comment <!-- Suggested products...-->. In order to make this call, we only need to specify the name of the action and the controller that we want to render.

Views/Blog/Index.aspx:

...
<td style="width:200px;vertical-align:top;">
<% Html.RenderAction("SuggestedProducts", "Product"); %>
</td>
...

8. Now you can run the application. Navigate to /Blog/Index and you should see a list of blog posts. Next to that you should also see a list of suggested products. Notice that our blog controller didn't have to know anything about products in order for it to use the SuggestedProducts view. This is the power of the RenderAction helper method.