ActionLink in ASP.NET MVC


Introduction: This is a sample application which can be use a smart card for verifying the employee in an organization by comparing his/her image while entering details. For this purpose, the user can use ActionLink to navigate the page to verify the image of the employee. In this case the user will have two different views and with the help of ActionLink, the user will navigate or move from one view to the next view that will be of image.

Steps to develop the Smart Card application in ASP.NET MVC

Step 1: Open visual studio 2010

  • New>Project
  • Project>ASP.NET MVC empty web application
  • Give a name to the application and Click on ok

1.gif

Step 2: Now the second step will be to add a Model class by right clicking on model and choose class after that name the class.

 model.gif

Now manipulate the code of the class as per the user requirements

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
namespace PCimage.Models
{
    public class
P
    {
        public string Name
        {
            get;
            set;
        }
        public int Eid
        {
            get;
            set;
        }
         public string Designation
       {
            get;
            set;
        }
    }
}

Step 3: Now to control the model class and view add controller by performing the following steps.

  • Choose add controller
  • Right click on controller folder in solution explorer
  • Name the controller

controoler.gif

Now code the controller according to the requirement

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using PCimage.Models;
namespace PCimage.Controllers
{
    public class CController :
Controller
    {
       
//
        // GET: /C/
        public ActionResult Index()
        {
            P detials = new P();
             return View(detials);
       }
        public ActionResult Image()
        {
            P detials = new P();
            return View(detials);
        }
    }
}

Step 4: After working on Model and Controller now add view for the action method.

view.gif

Code the View Index.aspx first

<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<PCimage.Models.P>" %>
<!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 id="Head1" runat="server">
    <title></title>
</head>
<
body>
    <div>
<h2>Smart card</h2>
<%= Html.ValidationSummary("PLz Try Again")%>
<% using (Html.BeginForm()) {%>
<fieldset>
<
p>
<
label for="Name">Name:</label>
<%= Html.TextBox("Name") %>
<%= Html.ValidationMessage("Name","*") %>
</p>
<p>
<
label for="Eid">Eid:</label>
<%= Html.TextBox("Eid") %> 
</p>
<
p>
<
label for="Designation">Designation:</label>
<%= Html.TextBox("Designation") %>
</p>
</
fieldset>
<
div id="menucontainer">
</div><p><%: Html.ActionLink("Show image of the person to verify the identity", "Image", "C")%></p>
<% } %>
</div>
</
body>
</
html>

Now before Coding the View Image.aspx copy image to solution explorer as shown

<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<PCimage.Models.P>" %>
<!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>Image</title>
</head>
<
body>
    <form id="form1" runat="server">
    <div>
           <asp:Image ID="Image1" runat="server" Height="302px"
            ImageUrl="~/600px-Smiley.jpeg.png" Width="261px"
/>
 
 </div>
  </form>
</body>
</
html>

Now your application is ready you can run it by pressing F5.

This will be the home screen:

ss1.gif

 Now fill the required fields:

s2.gif

Click on link that will navigate the user to image view as shown:

ssssn.gif

Up Next
    Ebook Download
    View all
    Learn
    View all