Home » ASP.net MVC » MVC 3 » MVC Examples » MVC Tutorials » Sample Register Form in Asp.net MVC3 Razor

Sample Register Form in Asp.net MVC3 Razor

Posted by 20Fingers2Brains on Tags: ASP.net MVC , MVC 3 , MVC Examples , MVC Tutorials

For creating Sample Register Form we have used one controller, two views and one model class.

Watch Video

Following are the Steps :

Step 1 :
Create a new empty internet ASP.NET MVC3 project.

Step 2 :

Creating Controller - Right Click Controller Folder => Add => Controller, a window will open as shown below.

Name the controller as LoginController and choose template as Empty. Click on Add. This will create a LoginController with default Index Action Method as shown below.

Step 3 :

Creating Model - Create a new Model class for our login View.

Right click on Model Folder => Add => New Item. A window opens. Add a new class file, under Web section and name it as Login.cs as shown below.

After clicking on Add, it will generate a default class file named Login.cs as shown below.

Our Model class is ready. We have to add properties which we are going to use in the Login Form. Add few properties to Login.cs file as shown below.

Our Model class is ready to use. Now we will create a view for Registering.

Step 4 :

Open the LoginController.cs right click inside the Login Method and click on Add View as shown below.

After clicking on Add view, a window will open.

Create a Login View. Do not select any checkboxes. We will create a plain simple view without model and Layout.

If we want we can include the layout and model class later. After creating the view, it will look like below.

Create a form and create controls or markup to display the properties defines in the model.

Include the reference of the model which we created earlier at the top section of the view as shown below.

Points To Remember :

LabelFor - LabelFor allows binding with the model property.

EditorFor - EditorFor renders control depending upon the property. Instead of using editor for, we have other options as well. We can use textbox, dropdown etc.

Form - We gave two attributes to the form. First property is the name of the action method to post the form. The second attribute is the name of the controller. button - Submit button is of type submit, on click of this button the form with entire properties is posted to the action method.

Lets see how SubmitLoginDetails() action method in controller looks like :

We created an action method of the same name we gave in the Login View's Form. This action method accepts an model object.

When you fill all the fields and press the submit button. The form is posted to this method, and the model object is filled with the values you entered, stored in the model properties. This model object is then passed to View corresponding to the SampleLoginView() action method.

Lets see how SampleLoginView looks like :