Welcome View
All four views will use the same master page, containing a
header and a menu stripe. Welcome view will.
Figure 5
Views in MVC# should implement the IView interface. For this
reason all our views inherit a base IView implementation - WebFormView (or its
generic version WebFormView<T> with a controller type specified as
generic parameter).
Product Categories View
As we mentioned earlier most of ASP.NET controls with their
server-side events better fit the Model-View-Presenter paradigm, rather than
MVC. Therefore, building user interfaces in MVC# applications is generally
easier than with ASP.NET MVC framework.
Like we did to the Welcome view, we make the Product
Categories view use the same master page and inherit from WebFormView<T>.
Then we place a DataList control on the form.
Figure 6
Next, let us edit an item template of the DataList control.
Inside this template we will put a link button named
"CategoryLinkButton" and then will configure data bindings for it by
selecting "Edit DataBindings..." from the context menu. Data Bindings
configuration dialog should be opened.
Figure 7
For each link's text to be the name of the corresponding
category, we set the Text property binding to Eval("CategoryName").
As we already know, the actual categories list is passed by
controller through the IProductCategories interface. This interface should be
implemented by the product categories view.
Listing 15
public partial class ProductCategories :
WebFormView<ProductCategoriesController>, IProductCategoriesView
...
public IList CategoriesList
{
get { return CategoriesDataList.DataSource as IList; }
set
{
CategoriesDataList.DataSource = value;
DataBind();
}
}
Finally, we should make the view handle category selection.
As soon as a category link is clicked the processing should be delegated to the
controller's CategorySelected(...) method (which we have already implemented).
For this let us add a handler for the ItemCommand event of the CategoriesDataList
control.
Figure 8
The handler, as we said, should pass the selected category
to the controller's CategorySelected(...) method.
Listing 16
public partial class ProductCategories :
WebFormView<ProductCategoriesController>, IProductCategoriesView
...
protected void CategoriesDataList_ItemCommand(object source,
DataListCommandEventArgs e)
{
DataRowView rv = CategoriesList[e.Item.ItemIndex] as DataRowView;
Controller.CategorySelected(rv.Row as NorthwindDataSet.CategoriesRow);
}
Products View
The Products view is similar in many aspects to the Product
Categories view- it contains a list of objects (implemented with DataList
control) with links to choose any one of them. Due to this similarity, we will
omit the description of any details.
Below is how the IProductsView interface is implemented.
Listing 17
public partial class Products : WebFormView<ProductsController>, IProductsView
...
private NorthwindDataSet.CategoriesRow category;
public NorthwindDataSet.CategoriesRow Category
{
get { return category; }
set
{
category = value;
ProductsDataList.DataSource = Category.GetProductsRows();
CategoryNameLabel.Text = Category.CategoryName;
DataBind();
}
}
Processing the "Edit" links click is done in the
same way as we did in the "Product Categories" view - by handling the
DataList.ItemCommand event.
Listing 18
public partial class Products : WebFormView<ProductsController>, IProductsView
...
protected void ProductsDataList_ItemCommand(object source,
DataListCommandEventArgs e)
{
object itm = (ProductsDataList.DataSource as IList)[e.Item.ItemIndex];
Controller.EditProduct(itm as NorthwindDataSet.ProductsRow);
}
Edit Product View
And again, steps to build the view are the same here:
inherit the view from WebFormView<T> specifying the controller type, design
the view surface, then make it implement the proper view interface (IEditProductView),
and finally make it handle user gestures by delegating the work to the
controller. Since the steps are analogous, we will skip them and proceed to the
next article part. If desired, a reader may see how the view is implemented in
the example source code.