URL Routing Of ASP.NET MVC And ASP.NET Web Forms

Introduction

Key Notes To ASP.NET MVC

ASP.NET MVC is open-source software. The ASP.NET MVC is a web application framework developed by Microsoft, which implements the model–view–controller pattern. Asp.Net MVC has Partial Views for code re-usability. In Asp.Net MVC, Views and logic are kept separately. Asp.Net MVC follows customizable syntax (Razor as default).Asp.Net MVC has html helpers.Asp.Net MVC is lightweight and follows MVC (Model, View, Controller) pattern based development model. Asp.Net MVC does not support view state.

Key Notes To Asp.Net Web Form

Asp.Net Web Form is not Open Source.Asp.Net Web Form follows a traditional event-driven development model.Asp.Net Web Form has server controls.Asp.Net Web Form supports view state for state management at client side.Asp.Net Web Form follows Web Forms Syntax.In Asp.Net Web Form, Web Forms(ASPX) i.e. views are tightly coupled to Code behind(ASPX.CS) i.e. logic. Asp.Net Web Form has User Controls for code re-usability.

Url Path Note Of ASP.NET MVC

Asp.Net MVC has route-based URLs which means URLs are divided into controllers and actions and moreover it is based on controller not on physical files.

Url Path Note Of ASP.NET Web Form

Asp.Net Web Form has file-based URLs means file name exist in the URLs must have its physical existence.

Description

 

Here I built one Asp.net MVC and Asp.net web form application.That will show you what the URL Path Concept Between ASP.NET MVC and ASP.NET Web Forms.

 

Link To Source Code

 

Click Here>> 

 

Steps to be followed For Asp.Net MVC

Step 1

Create a Mvc Project named "MvcWeb".

Step 2

Create class file in Models Folder named "Student.cs".

Code Ref

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.ComponentModel.DataAnnotations;

namespace MvcWeb.Models
{
    public class Student
    {
        [Display(Name = "Name")]
        public string StudentName { get; set; }
    }
}

Code Description

Add one variable or entity named "StudentName". To display the result in the page associate with label htmlhelper.

public string StudentName { get; set; }

We can control the display of data in a view using display attributes that are found in System.ComponentModel.DataAnnotations namespace.

[Display(Name = "Name")]

Step 3

Create a controller class file named "HomeController.cs".

Code Ref

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using MvcWeb.Models;

namespace MvcWeb.Controllers
{
    public class HomeController : Controller
    {
        //
        // GET: /Home/

        public ActionResult Satyaweb()
        {
            return View();
        }

    }
}

Code Description

Here I created one controller action method named "Satyaweb()". Add the namespace reference on Model class that is,

using MvcWeb.Models;

Step 4

Create one view named "Satyaweb.cshtml" in Views/Home Folder as the same name in controller action method.

Code Ref

@model MvcWeb.Models.Student
@{
    ViewBag.Title = "Satyaprakash";
}
<h2 style="background-color: Yellow; color: Blue; text-align: center; font-style: oblique">
    Satyaprakash's Mvc Path Concept</h2>
<fieldset>
    <legend style="font-family: Arial Black; color: blue">Student Name</legend>
    @Html.LabelFor(m => m.StudentName, "Satyaprakash Samantaray")
</fieldset>


<footer>
      <p style="background-color: Yellow; font-weight: bold; color:blue; text-align: center; font-style: oblique">© @DateTime.Now.ToLocalTime()</p> @*Add Date Time*@
</footer>

Code Description

Here I added namespace in view to access properties of student model class file. 

@model MvcWeb.Models.Student

LabelFor helper method is a strongly typed extension method. It generates a html label element for the model object property specified using a lambda expression. LabelFor() method Signature: MvcHtmlString LabelFor(<Expression<Func<TModel,TValue>> expression) .

@Html.LabelFor(m => m.StudentName, "Satyaprakash Samantaray")

We have specified the StudentName property of Student model using lambda expression in the LabelFor() method. So, it generates <label> and sets label text to the same as StudentName property name. Here labelfor htmlhelper will show the name "Satyaprakash Samantaray". 

 

Step 5

Set as start page In mvc.

Go to this file path "MvcWeb\App_Start\RouteConfig.cs". Open the file called "RouteConfig.cs".

Code Ref

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Web.Routing;

namespace MvcWeb
{
    public class RouteConfig
    {
        public static void RegisterRoutes(RouteCollection routes)
        {
            routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

            routes.MapRoute(
                name: "Default",
                url: "{controller}/{action}/{id}",
                defaults: new { controller = "Home", action = "satyaweb", id = UrlParameter.Optional }
            );
        }
    }
}

Code Description

So here I set start page :

defaults: new { controller = "Home", action = "satyaweb", id = UrlParameter.Optional }

 At page load time the controller Home and action method name satyaweb of home controller will be loaded.

OUTPUT OF MVC URL

http://localhost:1064/home/satyaweb

 

Here home is the controller name and satyaweb is the controller action method name.

 

Steps to be followed For Asp.Net Webform

Step1

Create a Asp.net Webform Project named "AspxWeb".

Step2

Create a new folder named "Home".



Step3

Then add webform named "Satyaweb.aspx".

Code ref of Satyaweb.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Satyaweb.aspx.cs" Inherits="AspxWeb.Home.Satyaweb" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Satyaprakash</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <h2 style="background-color: Yellow; color: Blue; text-align: center; font-style: oblique">
            Satyaprakash's Webform Path Concept</h2>
        <fieldset>
            <legend style="font-family: Arial Black; color: blue">Student Name</legend>
            <asp:Label ID="Satyalbl" runat="server" Text="Label"></asp:Label>
        </fieldset>
    </div>
    </form>
</body>
<footer>
        <p style="background-color: Yellow; font-weight: bold; color:blue; text-align: center; font-style: oblique">©<script>document.write(new Date().toDateString()); </script></p>
    </footer>
</html>

Code Description

Here I added label server control named "Satyalbl" .

<asp:Label ID="Satyalbl" runat="server" Text="Label"></asp:Label>

Code ref of Satyaweb.aspx.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace AspxWeb.Home
{
    public partial class Satyaweb : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            Satyalbl.Text = "Satyaprakash Samantaray";
        }
    }
}

Code Description

In the page_load() event I added label control id with associate result which will show in webpage during load time.

Step4

Set start page follow below image .



OUTPUT OF WEBFORM URL

 

http://localhost:1066/Home/Satyaweb.aspx

Here the Home is the name of the folder and Satyaweb.aspx name of the webform inside the Home folder.



Notes

In MVC , URL is mapped to a controller action method. Where as in web forms application, the URL is mapped to a physical file.

Module Summary

• What is Asp.net MVC.
• What is Asp.net Webform.
• The url path concept between ASP.NET MVC and ASP.NET Web Forms.
• Set start page in ASP.NET MVC and ASP.NET Web Forms.