How to Create ASP.NET MVC Complete application with Model View and Controller Components

By
Hi Friend, Here We will create MVC application with the help of Model ,view and controller components.This components are helpful to create asp.net mvc application easily and secure.Here i will show you working of each components with an example. In this tutorial,we will learn "how to pass data from model to controller and vice versa ,as well as how to pass data from controller to view in ASP.NET MVC Framework". Now i am going to to explain this whole concepts on visual studio 2010 with MVC 2 framework. Every MVC Framework(eg. mvc 2 ,mvc 3 ,mvc 4,mvc 5 and mvc 6) can be used to create this simple application. 
There are some steps to implement this whole concepts on your visual studio as given below:-

Step 1 :- First open your visual studio --> File --> Project -->Select Web --> Select ASP.NET MVC 2 Empty application --> OK,as shown below:-
        
CREATE

Step 2 :- Now open Solution Explorer --> Right click on Model folder -->Add -->New -->Item --> Select Class (Student.cs) -->Add ,as shown below:-
student

Step 3 :- Now create property for student class members as given below:-
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace Student_MVC_Application.Models
{
    public class Student
    {
        public int sid
        {
            get;
            set;
        }

        public string Name
        {
            get;
            set;
        }

        public int Age
        {
            get;
            set;
        }
        public double Fee
        {
            get;
            set;
        }
    }
}

Step 4 :- Now Open Solution Explorer  -->Right click on Controller  Folder --> Add -->Controller (Mystudent.cs) --> Add ,as shown below:-
class

Step 5 :- Now Add Model Class Namespace on above of your controller class as given below:-
Using  Student_MVC_Application.Models;
Note :- This namespace is present in student class (model layer). For this see step 3. 
Step 6 :-  Now open class ( MystudentController .cs ) --> Create the object of student class --> and define the student's members here --> and pass the student class object in View function as an argument as shown below:-
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using Student_MVC_Application.Models;
namespace Student_MVC_Application.Controllers
{
    public class MystudentController : Controller
    {
        //
        // GET: /Mystudent/

        public ActionResult Index()
        {
            Student obj_st = new Student();
            obj_st.sid = 10012;
            obj_st.Name = "Abhishek Patel";
            obj_st.Age = 25;
            obj_st.Fee =4200.80;
            return View(obj_st);
        }

    }
}

Step 7 :- Now Right click on ActionResult -->Add View --> Check Create strongly -typed view Box --> Select View data class from dropdown list ,as shown below:-
class


Note:- If you want to attached master page with your application then tick on Select master page box  as shown above image.
Step 8 :- Now write the codes in index.aspx page as given below:-
<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<Student_MVC_Application.Models.Student>" %>

<!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>Index</title>
    <style type="text/css">
        .style1 {
            color: #FF0000;
        }
    </style>
</head>
<body>
    <div>
        <span class="style1"><strong>Welcome to MY.NET Tutorials</strong></span> <br />
    The student ID is :<b><%=Model.sid %> </b><br />
    The student Name is :<b><%=Model.Name %> </b><br />
    The student Age is :<b><%=Model.Age %> </b><br />
    The student Fee is :<b><%=Model.Fee %></b> <br />
    </div>
</body>
</html>

Step 9 :- Now Run the application (Press F5) --> You will see following error message as shown below:-
error message
Note:- This error comes because we didn't invoke any Actions.
Step 10 :-  Now Put any Action (Mystudent) in browser URL -->press Enter Button -->You will see following output as shown below:-
Output
Step 11 :- If you want to open web page directly without typing Url parameter in browser --> open your solution Explorer window --> Open Global.asax file --> write your controller name and action name as shown in below image.
 Note :-

  • You will see same output as shown  in step 10.
  •  I will explain URL Routing concepts in coming post.This is the main part of MVC Application.

For More...
  1. HTTP and state management concepts in asp.net application
  2. Threading concepts in c#
  3. Transaction concepts in sql server
  4. Web forms control in asp.net
  5. How to host asp.net website free on server
  6. .NET Interview questions and answers
  7. Delegate concepts in c#
  8. Stored procedure in ms sql server
Download Attached file
   Download

0 comments:

Post a Comment

Powered by Blogger.