How to create a simple website in ASP.NET MVC
Part five of a seven-part series of blogs

This blog explains the steps you'll need to follow to create a simple one page website in ASP.NET MVC. The aim of the blog is not to act as a tutorial, but to help people choose between ASP.NET MVC and classic ASP.NET.

  1. An overview of creating a website in ASP.NET MVC
  2. Creating an ASP.NET MVC website
  3. Creating an entity model in MVC
  4. Creating a view model
  5. Ensuring MVC shows the right page - router and controller (this blog)
  6. Creating our view
  7. Conclusion

Posted by Andy Brown on 16 June 2014

You need a minimum screen resolution of about 700 pixels width to see our blogs. This is because they contain diagrams and tables which would not be viewable easily on a mobile phone or small laptop. Please use a larger tablet, notebook or desktop computer, or change your screen resolution settings.

Ensuring MVC shows the right page - router and controller

This is the page which is most profoundly different from classic ASP.NET: we need to ensure that MVC shows the right page.  To do this, we configure a router, then create a controller.

Configuring your router

When you created your website, Visual Studio automatically created a file called RouteConfig.cs in the App_Start folder:

The route configuration file

This code runs whenever you start a new website application.

 

If you double-click on this, you can now configure your router:

Router controller

Change the default controller to Film, from Home.

Routers intercept requests for web pages, and decide which controller should process them.  Here we've created a default router for all requests which will go to the Index action in the Film controller.

Creating a controller

Now that we've routed requests coming in to our website to a controller called Film, we need to create it!

Adding controllers

Right-click on the Controllers folder and choose to add one.

Choose to add something as above, then make sure you add a controller:

Choosing controller

Choose to add a controller.

Overtype the stem of the controller name:

Naming a controller

Overtype the text shown selected with the name of your controller (Film), keeping the Controller suffix.

 

You can now type in details for your controller:

Editing controller

Double-click on your controller to change what it does.

 

Here's what our controller will do:

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.Mvc;

// reference the namespace containing our view model

using MvcApplication4.ViewModels;

namespace MvcApplication4.Controllers

{

public class FilmController : Controller

{

// the default (and only) action for this controller

public ActionResult Index()

{

// create a new instance of our view model class

var FilmModel = new vmFilm();

// tell the default view that it should use this as its model

ViewData.Model = FilmModel;

// display the view called Index (since no other is specified)

return View();

}

}

}

The point of including this code in this blog is to illustrate how well you need to know about classes and programming.  This code:

  1. Creates a new vwFilm object (which in turn contains a property called Films).
  2. Tells MVC to use this as the basis for a view we're about to create, which will by default have the same name as the controller (ie Index).

This is much more complicated than in classic ASP.NET, where you just edit the relevant web page!

This blog has 0 threads Add post