Click here to Skip to main content
15,886,789 members
Articles / Web Development / ASP.NET

M-V-VM in ASP.NET MVC: Removing Dependencies Between ASP.NET Views and Controller Actions

Rate me:
Please Sign up or sign in to vote.
5.00/5 (1 vote)
30 Nov 2009CPOL2 min read 9.1K   2  
M-V-VM in ASP.NET MVC: Removing Dependencies Between ASP.NET Views and Controller Actions

Since the early days, I have always been a fan of the ASP.NET MVC framework, although I had one really big issue with it: the coupling of the controller actions in the view pages. This part was a real annoyance, since all the flow and logic was included in the controller, and none of it in the views, _except_ the action flow; this was included in the views by using Html.ActionLink.

This has always been a nuisance for me, so last week, as I was working on a project, I decided to fix this issue...

IMHO, the possible proceeding controller actions in the program flow should be defined in the controller action, and not in the view. So how could we do this, while still making it maintainable and easy to follow?

After considering a few alternative routes, and thinking about it event more, it suddenly hit me; why not represent the possible routes as data.

A few development cycles later, I had the following code in the controller:

C#
public ActionResult Index()
{
     ViewData.Model = new VMIndex()
     {
         AllTasks = rTask.Find.OrderBy(o => o.Name),
         AL_AddTask = this.ActionLink("Add new task",c=>c.AddNewTask(null,null))
     };
     return View();
}

And this code in the view:

ASP.NET
<h1>Task list</h1>
<%= Html.Grid(Model.AllTasks)
        .Columns(c=> {
            c.For(t => t.Name);
            c.For(t => t.Description);
            c.For(t => Html.ActionLink(t.AL_Status())).Named("Status").DoNotEncode();
            c.For(t => Html.ActionLink(t.AL_Edit())).Named("Edit").DoNotEncode();
            c.For(t => Html.ActionLink(t.AL_Delete())).Named("Delete").DoNotEncode();
        }).Empty("No tasks yet") 
%>
<hr />
<h3>Add a new task</h3>
<% using (Html.BeginForm(Model.AL_AddTask)) { %>
    Name<br />
    <%=Html.TextBox("Name") %><br />
    Description<br />
    <%=Html.TextArea("Description") %><br />
    <%=Html.SubmitButton(Model.AL_AddTask) %><br />
<% }%> 

Which looks rather nice in my opinion. Since I do not know whether I am the first person who thinks about this or not, I decided to publish the source code together with an example on github.

The technical implementation is actually quite simple; I implement the Model-View-Viewmodel pattern, which is used in WPF, using a simple wrapper class for the action links (i.e., commands in MVVM). Once I made that link, the rest was child's play.

Next to this, I also created some helper extensions, to make the code a little easier on the eyes.

I also think that by using this pattern, we should be able to implement a winforms/WPF app using the same controller. Anybody who is willing to send me a git patch of a WPF application using this controller: please do !!!

P.S.: This also makes the actionlinks testable in an easy way; another responsibility that has been taken away from the view !!!

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Founder Virtual Sales Lab
Belgium Belgium

Comments and Discussions

 
-- There are no messages in this forum --