Wrapping my head around MVC - one page, two views
I am really loving MVC, only really immersed in it for a couple of months but it is all coming together for me lately. The most difficult challenge I faced in the beginning was generating a mixed context view, by that I mean something more akin to a normal web page. Maybe some header information at top and a grid of data below. At first it was really easy to get something like a customers orders in the grid but how to display another grid of customer address information on the same page. So to accomplish this lets say that you have a class that has the orders info.
Orders.cs
customerid
orderid
balance
description
And you have a customer class
Customers.cs
customerid
customername
streetaddress
Cust_ordersDTO.cs
CustomerID
orderid
balance
description
CustomerName
StreetAddress
public List<Cust_orders> AddressList { get; set; }
public List<Cust_orders> OrderList { get; set; }
So you will need to make a new class that has all properties combined into one for your view to use. Add a couple of lists, as I did see the red items above, so you will be able to separate your data into different groups - I am only going to use one in this example but made the other one in case I needed it.
Then in your controller you can have two methods to populate each section of your page
Populate your header like this:
var bl = new Myproject.Business.myCustomer_provider();
var headerinfo = new List<Cust_ordersDTO>();
headerinfo = bl.GetCustomerHeader().ToList();
Then drop the results into a ViewBag
ViewBag.HeaderInfo = headerinfo;
Populate your orders as normal returning the view from your controller.
Then on the page there are two ways to display your header information, incidentally, I am using an IEnumerable version of my model.
You can just loop through your Viewbag items like this:
@foreach (var item in ViewBag.HeaderInfo)
{
@item.BusinessName
@item.CustomerID
@item.StreetAddress
@item.CustomerName
}
or if you want to be able to manipulate the data such as in a form you can assign the Viewbag info into a model object
var hdinfo = ( List<Cust_ordersDTO>)ViewBag.HeaderInfo;
foreach (var item in hdinfo)
{
@Html.TextBoxFor(model => item.CustomerID,new { @readonly = "readonly" })
@Html.DisplayFor(model => item.CustomerName)
@Html.DisplayFor(model => item.StreetAddress)
*you could even put it in textboxes for update
@Html.TextBoxFor(model => item.StreetAddress,new {style = "width: 200px;"})
}
Orders.cs
customerid
orderid
balance
description
And you have a customer class
Customers.cs
customerid
customername
streetaddress
Cust_ordersDTO.cs
CustomerID
orderid
balance
description
CustomerName
StreetAddress
public List<Cust_orders> AddressList { get; set; }
public List<Cust_orders> OrderList { get; set; }
So you will need to make a new class that has all properties combined into one for your view to use. Add a couple of lists, as I did see the red items above, so you will be able to separate your data into different groups - I am only going to use one in this example but made the other one in case I needed it.
Then in your controller you can have two methods to populate each section of your page
Populate your header like this:
var bl = new Myproject.Business.myCustomer_provider();
var headerinfo = new List<Cust_ordersDTO>();
headerinfo = bl.GetCustomerHeader().ToList();
Then drop the results into a ViewBag
ViewBag.HeaderInfo = headerinfo;
Populate your orders as normal returning the view from your controller.
Then on the page there are two ways to display your header information, incidentally, I am using an IEnumerable version of my model.
You can just loop through your Viewbag items like this:
@foreach (var item in ViewBag.HeaderInfo)
{
@item.BusinessName
@item.CustomerID
@item.StreetAddress
@item.CustomerName
}
or if you want to be able to manipulate the data such as in a form you can assign the Viewbag info into a model object
var hdinfo = ( List<Cust_ordersDTO>)ViewBag.HeaderInfo;
foreach (var item in hdinfo)
{
@Html.TextBoxFor(model => item.CustomerID,new { @readonly = "readonly" })
@Html.DisplayFor(model => item.CustomerName)
@Html.DisplayFor(model => item.StreetAddress)
*you could even put it in textboxes for update
@Html.TextBoxFor(model => item.StreetAddress,new {style = "width: 200px;"})
}
Comments