List of Figures

Chapter 1. High-speed beginner ramp-up

Figure 1.1. The relationship between the model, view, and controller. The solid lines indicate a direct association, and the dashed lines indicate an indirect association. (Graphic and description used with permission from Wikipedia.)

Figure 1.2. The New Project dialog box. Notice the ASP.NET MVC 2 project templates.

Figure 1.3. Visual Studio prompts you to create a unit test project. For now, select No.

Figure 1.4. The default ASP.NET MVC project template is fully functional.

Figure 1.5. The Add Controller dialog box in Visual Studio

Figure 1.6. Right-click on an action to create a view.

Figure 1.7. The Add View dialog box

Figure 1.8. The GuestBook view

Figure 1.9. Submitting the Guest Book form

Figure 1.10. Your data is displayed back to you.

Figure 1.11. Creating a strongly typed view using the Add View dialog box

Chapter 2. Presentation model

Figure 2.1. A table in our user interface

Figure 2.2. A form for user input

Figure 2.3. A combined display and input form

Chapter 3. View fundamentals

Figure 3.1. The current user’s profile page

Figure 3.2. The logon screen

Figure 3.3. The ChangePasswordModel template in the EditorTemplates folder

Figure 3.4. Creating a global Object editor template in the Shared folder

Figure 3.5. The float-based layout enforced by our custom Object template

Chapter 4. Controller basics

Figure 4.1. Storyboard of an application’s user interactions

Figure 4.2. The user edit view

Figure 4.3. The redirected action showing a message from TempData

Figure 4.4. The alternate path showing validation messages

Figure 4.5. A controller unit testing passing

Chapter 5. Consuming third-party components

Figure 5.1. The view produced by Grid.AutoGenerateColumns

Figure 5.2. The MvcContrib Grid rendered using column configuration

Figure 5.3. The Upload Files screen showing the file selector template

Figure 5.4. The Upload Files screen showing the file listing template

Figure 5.5. The Upload Files screen with the progress bar

Figure 5.6. The Upload Results screen

Chapter 6. Hosting ASP.NET MVC applications

Figure 6.1. Running the MVC application locally allows us to use “pretty” URLs, with no extensions.

Figure 6.2. Click Add Web Site in the IIS 7 Manager console.

Figure 6.3. Final configuration values for the IIS 7 MVC deployment

Figure 6.4. Our MVC application deployed in IIS 7

Figure 6.5. Using the .aspx configuration produces modified URLs.

Figure 6.6. The website’s Properties dialog box

Figure 6.7. Configuration values for the new .mvc IIS extension mapping

Figure 6.8. Configuring wildcard mapping to map to ASP.NET.

Figure 6.9. Creating an application for a subfolder temporarily

Figure 6.10. Removing the wildcard mapping from a subfolder

Figure 6.11. Removing the application from the subfolder

Figure 6.12. Configuring the ISAPI Rewrite filter

Chapter 7. Leveraging existing ASP.NET features

Figure 7.1. The TextBox renders correctly.

Figure 7.2. The resulting HTML for the TextBox is less than desirable.

Figure 7.3. The menu control renders okay in Firefox and IE. Unfortunately it depends on a server-side form tag, and JavaScript surgery would be needed to make it function properly. WebKitbased browsers (Chrome and Safari) have problems with the JavaScript used to pop open the menus.

Figure 7.4. The horrific markup that’s rendered by the Menu control. Stay tuned for a better way.

Figure 7.5. The GridView renders properly.

Figure 7.6. Refreshing the page gives us the same result for up to 100 seconds.

Figure 7.7. StackOverflow.com is a good example of how you can use output caching in combination with Html.RenderAction() to cache different regions of the page. On the home page, some sections can be cached globally, and other sections are rendered per user.

Figure 7.8. Tracing information appended to the bottom of our page

Figure 7.9. Viewing the tracing info for each request using the Trace.axd HttpHandler

Figure 7.10. Adding an App_GlobalResource directory and a default resource file to the project

Figure 7.11. Our site’s resources

Figure 7.12. A localized resource file for Spanish (es-ES)

Figure 7.13. Our new resource file is added to the App_GlobalResources folder.

Figure 7.14. Seeing the strings from the resource file live on the site. This browser is Mozilla Firefox with a custom skin.

Figure 7.15. Setting our preferred language to Spanish in Firefox

Figure 7.16. Viewing the site with a different preferred language setting in the browser

Figure 7.17. Adding local resources for the Index view

Figure 7.18. Displaying the site map breadcrumbs on the master page

Chapter 8. Domain model

Figure 8.1. An example domain model

Figure 8.2. The Order aggregate

Figure 8.3. IProductRepository—all persistence operations on the aggregate root

Chapter 9. Extending the controller

Figure 9.1. The IController interface exposes a single method, Execute().

Figure 9.2. The ControllerBase class provides integration with routing as well as HttpContext.

Figure 9.3. The action filter methods that can be overridden to modify an action.

Figure 9.4. Action selectors in ASP.NET MVC

Chapter 10. Advanced view techniques

Figure 10.1. The Profile partial located in our Profile Views folder

Figure 10.2. Adding the Spark assembly references to our project

Figure 10.3. The complete folder structure for our Spark views

Figure 10.4. Adding an Application.spark layout for our views

Figure 10.5. IntelliSense in our Spark views is possible because of the Visual Studio add-in.

Figure 10.6. Our running Spark application

Chapter 11. Security

Figure 11.1. The comments page

Figure 11.2. The comment—unbeknownst to the visitor, a nasty script is executed.

Figure 11.3. Hacking success—the cookie has been sent to the attacking site.

Figure 11.4. Our script rendered harmlessly.

Figure 11.5. Protected from dangerous input by ASP.NET

Figure 11.6. Enticing the user to click a button

Figure 11.7. The form is posted to the vulnerable site.

Figure 11.8. An exception is thrown if the request isn’t accompanied by a special token.

Chapter 12. Ajax in ASP.NET MVC

Figure 12.1. The request is submitted asynchronously. Firebug (shown at the bottom of the browser window) allows us to inspect Ajax calls for better debugging.

Figure 12.2. These form values are serialized and sent to the server via Ajax. The result is a seamless method of adding sessions without a page refresh. When you disable JavaScript, it continues to work, but with page refreshes.

Figure 12.3. When an Ajax call is initiated, Firebug shows it in the Console. You can use this tool to inspect the actual request and response of an Ajax call.

Figure 12.4. Listing the speakers. When you click a name, you’re directed to a speaker detail page.

Figure 12.5. The speaker details are shown on a separate page.

Figure 12.6. The JSON object diagram shows us a simple way of understanding the format. Used with permission from http://json.org.

Figure 12.7. Our JSON result from the browser opened up in Notepad. The .json extension causes the response to be JSON instead of HTML.

Figure 12.8. Our finished Ajax-enabled page

Chapter 13. Controller factories

Figure 13.1. Trying to use constructor dependencies without replacing the controller factory

Figure 13.2. The IMessageProvider is invoked to display a message. The actual implementation is decoupled from the controller.

Figure 13.3. Our controller is now provided with a Ninject-specific IMessageProvider, but the controller doesn’t know (or care).

Figure 13.4. The final example shows the IMessageProvider interface being fulfilled by Windsor.

Chapter 14. Model binders and value providers

Figure 14.1. The class diagram of our SmartBinder showing the relationship to IFilteredModelBinder

Figure 14.2. The Edit screen now skips the need to load the profile manually.

Figure 14.3. The logon widget pulls profile information straight from Session.

Chapter 15. Validation

Figure 15.1. An Edit screen with a required field

Figure 15.2. Validation error resulting from a missing company name

Figure 15.3. The Edit screen with friendlier input labels and error messages

Figure 15.4. The ASP.NET Ajax client libraries and supporting debug files

Figure 15.5. The generated metadata and validation information

Figure 15.6. The client-side validation in action

Chapter 16. Routing

Figure 16.1. Inbound routing refers to taking an HTTP request (a URL) and mapping it to a controller and action.

Figure 16.2. Outbound routing generates appropriate URLs from a given set of route data (usually controller and action).

Figure 16.3. Decomposing a URL into route values using the default route of {controller}/{action}/{id}

Figure 16.4. The results of our route tests in the ReSharper test runner

Chapter 20. Full system testing

Figure 20.1. Clicking the Products tab

Figure 20.2. Clicking the Edit link for a product

Figure 20.3. Modifying product information and saving

Figure 20.4. Verifying the correct landing page and changed information

Figure 20.5. Adding the new string template

Chapter 21. Organization with areas

Figure 21.1. The Add > Area context menu option

Figure 21.2. The Add Area dialog box

Figure 21.3. A project with three separate areas

Figure 21.4. The ProfileController and views in the Admin area folder

Figure 21.5. The Edit profile screen with links to outside areas

Figure 21.6. The incorrectly generated URL containing extra area parameters

Figure 12.7. Our application, including the two T4MVC template files

Figure 21.8. The T4 template security dialog

Figure 21.9. Helper files generated from the T4MVC templates

Chapter 22. Portable areas

Figure 22.1. A portable area class library project

Figure 22.2. Visual Studio’s Properties window

Figure 22.3. Layout of the RssWidget portable area

Figure 22.4. The view that uses the RssWidget portable area

Chapter 23. Data access with NHibernate

Figure 23.1. Recent visitors are displayed at the bottom of every page.

Figure 23.2. The onion architecture uses the concept of an application core that doesn’t depend on external libraries, such as NHibernate.

Figure 23.3. The Core project has minimal references and no external dependencies.

Figure 23.4. No project references Infrastructure. This arrangement is important for decoupling.

Figure 23.5. The Infrastructure project contains the NHibernate mapping for Visitor.

Figure 23.6. The IntegrationTests project contains tests for all the mappings and repositories.

Figure 23.7. When the repository test passes, we know the mapping is correct. The test results are shown in the ReSharper test runner.

Figure 23.8. The additions to the project are shown in boxes. We’ve added several files to support the capture and display of visitors.

Figure 23.9. The application works as expected after being wired together.

Chapter 24. Debugging routes

Figure 24.1. This message doesn’t tell us much about what’s wrong. An action couldn’t be found on the controller, but which one?

Figure 24.2. Appending the query string parameter “?routeinfo” to our URL gives us detailed information about the current request’s route. We can see now that the wrong route was chosen.

Chapter 25. Customizing Visual Studio for ASP.NET MVC

Figure 25.1. The Add View dialog box allows us to autogenerate scaffolding for our model.

Figure 25.2. Copy the templates from the default templates folder into a CodeTemplates folder in your project to customize them.

Figure 25.3. Adding new template files in the Add View folder enables them for selection in the Add View dialog box.

Figure 25.4. When we create a new project, we’re asked if we want to create a unit-test project.

Figure 25.5. Adding a registry entry for a new custom test project template. Note that this registry path is for 64-bit machines.

Figure 25.6. Our new test template is now available in the Create Unit Test Project dialog box.

Chapter 27. Recipe: creating an autocomplete text box

Figure 27.1. Google Suggest filters options as we type.

Figure 27.2. Our simple view with a text box

Figure 27.3. A simple HTTP GET for the action with a filter of “hou” yields the expected results.

Figure 27.4. The results are displayed in a <ul> tag. We can apply CSS to make it look nicer.

Figure 27.5. The styled drop-down results look much nicer. The selected item is highlighted and can be chosen with the keyboard or mouse.