Implementing MVC Design Pattern in .NET

Introduction

Design patterns are very useful to solve complex design problems if used properly. This article explains the basic concept of the Model View Controller (MVC) Design pattern and also shows how closely .NET Framework can be used to implement the MVC design pattern with the one that originally conceived.

Prerequisites

Object Oriented-programming concepts, .NET Framework, ADO.NET, C#, XSD.

Definition/Description: Model View Controller (MVC)

View renders the data from the Model in response to the request made to the model by controlled events made by user interaction.

Model View Controller is a design approach to separate the application object model from GUI, originally invented around 80s. Then later on it has become a widely accepted common design pattern. The main objective behind this pattern is to decouple the view of the data (presentation layer) from the actual data processing so that the same model can be used for various views. This is achieved by using three different types of objects that interact with each other in loosely coupled manner with their discreet set of tasks.

These three objects are known as Model, View and Controller. We will learn for each of them here.

MVCDes1.gif

View

View is the graphical data presentation (outputting) irrespective of the real data processing. View is the responsible for look and feel, some custom formatting, sorting etc. View is completely isolated from actual complex data operations. For example, Online product catalog view is completely separated from database connection, query, tables etc. It simply gets final row-data from the model and puts some cosmetics and formatting before displaying it in browser. View provides interface to interact with the system. The beauty of MVC approach is that it supports any kind of view, which is challenging in todays distributed and multi-platform environment.

A MVC model can have multiple views, which are controlled by controller. View interface can be of WEB-FORMS, HTML, XML/XSLT, XTML, and WML or can be Windows forms etc. 

Model

Model is responsible for actual data processing, like database connection, querying database, implementing business rules etc. It feeds data to the view without worrying about the actual formatting and look and feel. Data provided by Model is display-neutral so it can be interfaced with as many views without code redundancy; this eases your code maintenance and reduces bugs and allows code -reuse at good extent. Model responds to the request made by controllers and notifies the registered views to update their display with new data.

Controller

Controller is responsible for Notice of action. Controller responds to the mouse or keyboard input to command model and view to change. Controllers are associated with views. User interaction triggers the events to change the model, which in turn calls some methods of model to update its state to notify other registered views to refresh their display.

Benefits

Following are the few of the benefits of MVC design pattern.

  • Since MVC handles the multiple views using the same enterprise model it is easier to maintain, test and upgrade the multiple system.

  • It will be easier to add new clients just by adding their views and controllers.

  • Since the Model is completely decoupled from view it allows lot of flexibilities to design and implement the model considering reusability and modularity. This model also can be extended for further distributed application.

  • It is possible to have development process in parallel for model, view and controller.

  • This makes the application extensible and scalable.

Drawbacks:

  • Requires high skilled experienced professionals who can identify the requirements in depth at the front before actual design. 

  • It requires the significant amount of time to analyze and design.

  • This design approach is not suitable for smaller applications. It Overkills the small applications.

.NET and MVC:

Lets try to find out how closely ASP.NET allows architecting application to meet MVC concept. 

  • Model: Dataset/Business Entities, DataAccess components
  • View: .ASPX pages 

Controller: Code-behind .vb/.cs files

Typed dataset is one of the greatest features in .NET, which holds the application data in memory and represents the application business entity model, which bridges the UI components with Service Interface and Data Access layer.

So, service interface and Data Access components populate these typed Datasets. Now, these filled datasets can be bound to any view in UI layer.

.ASPX and ASCX pages server as view and mean to interface with application, while the code behind classes for these files server as the controller functions.

ASP.NET does not have central controller function, instead the code-behind file can directly make request to the Model and can update the dataset. But lot of controller function can be implemented in code behind class events in .aspx or .ascx pages, like Page_Onload(), OnItem_Created() etcevents.

.NET Framework has all Object-oriented features like code reuse, encapsulation etcSo, proper design of your model can make your user interface and view completely separated from model which can server multiple views. 

Sample Code:

The following sample illustrates the MVC design using .NET Framework with C#. This application retrieves the Orders from the database (we used XML File as data source) in typed dataset. This example has two different kinds of views for displaying orders on webform for the same Model using Web.UI controls. 

Code walkthrough:

Typed DataSet (Business Entity):

This is the XML order xml schema, which represents the typed dataset for Orders.

MVCDes2.jpg

ASPX:

MVCDesign.aspx webform displays two different views for the same dataset.

  1. protected MVCDesignCSharp.XMLData.Orders ordersDataSet;  
  2. privatevoid Button1_Click(object sender, System.EventArgs e)   
  3. {  
  4.     BizOrderManager.GetOrderList(ordersDataSet);  
  5.     if (DataGrid1.Visible == false)   
  6.     {  
  7.         DataList1.Visible = false;  
  8.         DataGrid1.Visible = true;  
  9.         DataGrid1.DataBind();  
  10.         Button1.Text = "Show View 1";  
  11.     }   
  12.     else   
  13.     {  
  14.         DataList1.Visible = true;  
  15.         DataGrid1.Visible = false;  
  16.         DataList1.DataBind();  
  17.         Button1.Text = "Show View 2";  
  18.     }  
  19. }  
  20. privatevoid Button2_Click(object sender, System.EventArgs e)   
  21. {  
  22.     BizOrderManager.GetOrderList(ordersDataSet);  
  23.     DataList1.Visible = true;  
  24.     DataGrid1.Visible = true;  
  25.     DataList1.DataBind();  
  26.     DataGrid1.DataBind();  
  27.     Button1.Text = "Show Only View 2";  
  28. }   

Business Objects:

This is the component method, which can be requested by controller. This business component can interact other data access components.

  1. publicstaticvoid GetOrderList(DataSet OrderDS)  
  2. {  
  3.    OrderDS.ReadXml(AppDomain.CurrentDomain.BaseDirectory + "/XMLData/Orders.xml");  
  4. }  

DataSource

For easy configuration and simplification I have used XML files as data source for this application.

How to Run this Code:

  • Unzip the MVCDesign.zip

  • Build the solution MCDesign.sln

  • Run the application.


Similar Articles