Adding a View
In the section “Specifying a View,” you learned how a controller specifies a view. But how does that view get created in the first place? You could certainly create a file by hand and add it to your Views directory, but the ASP.NET MVC tooling for Visual Studio makes it very easy to add a view using the Add View dialog.
Understanding the Add View Dialog Options
The easiest way to display the Add View dialog is to right-click in an action method. For this example, you'll add a new action method named Edit and then create a view for that action using the Add View dialog. Begin by adding an Edit action method to the HomeController in an MVC 4 application that contains the following code:
public ActionResult Edit()
{
return View();
}
Next, launch the Add View dialog by right-clicking within an action method and selecting Add View (see Figure 3.2).
This brings up the Add View dialog, as shown in Figure 3.3.
The following list describes each menu item in detail:
- View name: When launching this dialog from the context of an action method, the view name is prepopulated using the name of the action method. Naturally, the view name is required.
- View engine: The second option in the dialog is the view engine. Starting in ASP.NET MVC 3, the Add View dialog supports multiple view engine options. We'll cover more about view engines later in this chapter. By default, there are two options in the dialog, Razor and ASPX. This drop-down is extensible so that third party view engines can be listed in the drop-down.
- Create a strongly-typed view: Selecting the checkbox labeled Create a strongly-typed view enables typing in or selecting a model class. The list of types in the drop-down is populated using reflection, so make sure to compile the project at least once before selecting a model type.
- Scaffold template: Once you select a type, you can also choose a scaffold template. These templates use the Visual Studio T4 templating system to generate a view based on the model type selected and are listed in Table 3.1.
Table 3.1: View Scaffold Types
| Scaffold | Description |
| Empty | Creates an empty view. Only the model type is specified using the @model syntax. |
| Create | Creates a view with a form for creating new instances of the model. Generates a label and input field for each property of the model type. |
| Delete | Creates a view with a form for deleting existing instances of the model. Displays a label and the current value for each property of the model. |
| Details | Creates a view that displays a label and the value for each property of the model type. |
| Edit | Creates a view with a form for editing existing instances of the model. Generates a label and input field for each property of the model type. |
| List | Creates a view with a table of model instances. Generates a column for each property of the model type. Make sure to pass an IEnumerable<YourModelType> to this view from your action method. The view also contains links to actions for performing the create/edit/delete operations. |
- Reference script libraries: This option is used to indicate whether the view you are creating should include references to a set of JavaScript files if it makes sense for the view. By default, the _Layout.cshtml file references the main jQuery library, but doesn't reference the jQuery Validation library or the Unobtrusive jQuery Validation library.
When creating a view that will contain a data entry form, such as an Edit view or a Create view, checking this option ensures that the generated view does reference these libraries. These libraries are necessary for implementing client-side validation. In all other cases, this checkbox is completely ignored.
- Create as a partial view: Selecting this option indicates that the view you will create is not a full view, thus the Layout option is disabled. For the Razor view engine, the resulting partial view looks much like a regular view, except there will be no <html> tag or <head> tag at the top of the view.
- Use a layout or master page: This option determines whether or not the view you are creating will reference a layout (or master page) or will be a fully self-contained view. For Razor view engines, specifying a layout is not necessary if you choose to use the default layout because the layout is already specified in the _ViewStart.cshtml file. However, this option can be used to override the default Layout file.
The Add View dialog really gets interesting when you're working with models. You'll see that in detail in Chapter 4, which walks through building out models and creating scaffolded views using the view scaffold types we've just discussed.