How to: Add a View to an MVC Application in Visual Studio

In ASP.NET MVC, views (sometimes referred to as view pages) represent the UI for the application. As a user interacts with a view, data is routed from that view to a controller action method, which in turn might render another view. An MVC application might have several controllers, each of which might contain multiple action methods; each action might render a different view. Views are organized in folders that are named after the associated controller.

This topic shows you how to add a view to an MVC application either from Solution Explorer or from an action method in the code editor.

Adding a View from Solution Explorer

To add a view to an MVC application from Solution Explorer

1. In Solution Explorer, expand the Views folder and right-click the folder that is named after the controller that will render the new view.

   For example, if the controller named HomeController will render the view, right-click the Home folder.

   Note

   For an MVC application, Visual Studio requires the views for each controller to be grouped in a folder that is named after the controller. For example, the views for HomeController are grouped in the \Views\Home folder, and the views for AccountController are grouped in the \Views\Account folder.

2. Click Add, and then click View.

   The Add View dialog box is displayed.

   

3. In the View name box, type the name of the view.

   The name of the view must be the same as the name of the action method. For example, if the action method is named Income, name the associated view Income.aspx.

4. If you want to create a partial view, select the Create a partial view (.ascx) check box.

   A partial view defines a part of a view that can be updated asynchronously.

5. If you want the view to use a strongly typed ViewDataDictionary<TModel> object, select the Create strongly-typed view check box. From the View data class list, select the class that defines the data model. From the View content list, select the content view template to use.

   The View content list contains view templates that address common scenarios for displaying and changing data. The available templates are as follows:

   • Empty, which creates a strongly typed view that has no content.

   • List, which creates a view that shows the data objects in a list.

   • Details, which creates a view that shows the values that are in a data object.

   • Create, which creates a view that enables the user to add a data object to the list.

   • Edit, which creates a view that enables the user to change the values of a data object.

6. If you want the view to use a master view, select the Select master page check box and then browse to the master view that you want to use. In ContentPlaceHolder ID, type the string that specifies the default area for adding view content.

7. Click Add.

   The new view is generated.

Adding a View from an Action Method

To add a view to an MVC application from the code editor

1. In the code editor, open the controller class file that you want to add a view for.

2. Right-click anywhere in the action method that will render the view.

3. Click Add View.

   The Add View dialog box is displayed. By default, the name of the view will be the same as the action method.

   

4. Follow steps 3 through 7 of the previous procedure.

See Also

Concepts

Views and UI Rendering in MVC Applications