Share

Friday, 26 August 2011

Creating a Partially Generated Model


Previous lesion of this tutorial please click for this link Introduction of asp.net mvc3



Wednesday, 24 August 2011

ASP.NET MVC3 with Razor engine



Introduction
This tutorial primarily focuses for people who are new to MVC application. First tutorial we look at the how to set up MVC 3 in visual studio 2010. Before you follow this tutorial you should set up web platform installer in your machine. After you install web platform within your machine you can download visual studio 2010 express and SQL server express in to your machine.


You can download Web platform by clicking Download button. By using web platform installer you can install any library to your local machine.


After clicking install button I web platform installer you can install visual studio 2010 and sql server express edition within your machine. To work with mvc 3 you have to go one more step. so you have to install visual studio sp1 for your machine. Now you can use visual studio 2010.


Now you can double click visual studio 2010 and you can select ASP.net MVC 3 web application.

Now you can give any name for project name and you can browse a path for your project. Then you can click ok button. After you click ok button you can see this following window.

In this tutorial I am going to use Razor view engine as my view engine so I select Rezor engine and select internet application as my template. More about Razor engine I will talk later. Then click ok. After click ok button project load to the visual studio 2010.Now you can see the project structure.
Without any changing you can run the application using f5 or clicking Start debugging button. After you running application you can see following view on browser.


Now we look at the structure of MVC3 application.  When you look at the structure of the application you can identify models folder, view folder, view folder and more. MVC is a design pattern called MODEL VIEW CONTROLLER design pattern. This design pattern is used most of the present web application.


Controller
Controller is represented by “C” This is code you write to handle the user interaction (often called input logic) and the connection between the model and the view. A controller is a class that inherits from System.Web.Mvc.Controller. It includes logic for processing user events or actions. HTTP requests are routed to individual controllers; the controller responds to the request by calling the model and selecting a view for displaying results.


Model
The model is the data and related business logic or validation rules in your application. The model objects typically can retrieve, update, and add records to an  underlying data store such as a Microsoft SQL Server database. A model can be a LINQ  to SQL layer, an Entity Framework layer, or some other layer that provides access to your data and the business rules.

View
The view indicates how data from the model will be displayed. It is a set of webpages and user controls that define layout for model data based on user actions such as read, edit, and insert. For example, you might have a view that defines specific layout information for a page that allows a user to edit a Customer object from your model. View tasks do not include the input logic or the processing of user actions; these are managed inside the controller. This separation is what makes the input logic more test-ready for unit testing.


In MVC3 any view has a particular Controller. You can see Views folder in above application, there is a home view and it has a particular controller e.g.: Home view has controller called HomeController. Any controller must have controller suffix for the name.

Now I am going to add a new Controller for the application and add view for that controller. First you have to right click the controller folder and add a new controller to application


I gave TestController as my controller name.
This is the controller that I added before. To add a view for this controller you can right click within the controller and  add a view for this controller.
This is the controller that I added before. To add a view for this controller you can right click within the controller and  add a view for this controller.
After you click Add button you can add a new view for TestController.
Now you can run the application and change the default url for Test application page. Eg: http://localhost:2202/Test/ then you can see the newly added view. Now I am going to change Controller’s Index method and little bit.  I added following code into Index method and change view like following
After you run again application, you can see following view


In MVC3 there is no viewState for that Razor engine use ViewBag.AnyName. you can use ViewBag state for instead of ViewSatate
This is the end of my first tutorial next tutorial I would like to talk about controller view and razor engine furthermore.   

Define a Model

Now I am going to talking about Model component of MVC. Model is responsible for provide data to the Viewer. In this tutorial I am not going to connect with database. First of all we need to add a class to the Model folder.
Now rename class name as StudentModel. Then you have to write class as follow
Now add a class .cs class called StudentModelList in to the Model Folder. That class is used for provide list of student for user.
Now we are going to ass Controller class to the Controller folder. Add a Controller called StudentController to the Controller folder.
Now Modify the StudentController like following
Then right click within in the Index method and add View for the controller.


Select StudentModel as Model class and List as Scaffold template then click Add button. (I will talk about Scaffold template and more in this tutorial). Then Visual Studio generate a Student view for the project . Now we can modify view of student as follow.
Now you can run the application and change the browser Url like following url http://localhost:49389/Student
Then you can see following result
Now I am going to explain some of core things that I had done before
public ActionResult Index()
        {
            StudentModelList _studentModelList = new StudentModelList();
            List<StudentModel> studentList = _studentModelList.GetListOfStuden();
            return View(studentList);
        }


In here I defined a student list and that passed to the view so catch that model with in view we should define model type so in the student view we define model like following code
@model IEnumerable<MyFirstMVC3Application.Models.StudentModel>

@{
    ViewBag.Title = "Index";
}




This code define model as a StudentModel List

@foreach (var item in Model) {

    <tr>

        <td>

            @Html.ActionLink("Edit", "Edit", new { /* id=item.PrimaryKey */ }) |

            @Html.ActionLink("Details", "Details", new { /* id=item.PrimaryKey */ }) |

            @Html.ActionLink("Delete", "Delete", new { /* id=item.PrimaryKey */ })

        </td>

         <td>

            @item.Id

        </td>

        <td>

            @item.Name

        </td>

         <td>

            @item.Age

        </td>

    </tr>

}

Then we get one Student at a time and show that student information. It is show in above code. In rezor view all the c# or vB code can used within the @ sign. So you can write any c# code  after the @ sign.







Next I hope to talk about how to define Partially Generated Model class and more about model. Partial class and partial method concepts to provide additional metadata and validation logic to your generated model

For Partially Generated Model tutorial please click this url http://aspnetmvc3-foxmurderer.blogspot.com/2011/08/creating-partially-generated-model_26.html