MVC Training Part 2
Download as PPTX, PDF0 likes523 views
This document discusses several key concepts in ASP.NET MVC including areas, HTML helpers, partial views, dependency injection, model validation, and asynchronous controller actions. It provides code examples for creating an area, partial view, unit tests, and using model attributes for validation. The document is intended to be part of an ASP.NET MVC training and covers important topics like routing, generating HTML, reusing views, testing, and asynchronous programming.
![Scaffolding Views
It is possible to auto-generate the input fields for a
Views Model properties
@Html.EditorForModel()
May have to ignore unwanted Model properties
with [ScaffoldColumn(false)]](https://image.slidesharecdn.com/mvctraining-part2-150501084750-conversion-gate02/85/MVC-Training-Part-2-16-320.jpg)
![Exercise : Scaffolding View
using Model Change the save form on
the Index View to use
@Html.EditorForModel() and
run
You should see most of the
properties are provided
with relevant inputs
To tell the ‘auto-scaffolder’
to ignore certain properties,
give the properties the
[ScaffoldColumn(false)]
attribute](https://image.slidesharecdn.com/mvctraining-part2-150501084750-conversion-gate02/85/MVC-Training-Part-2-17-320.jpg)
![Model Attributes
Model properties can be given attributes to provide
additional information about them
This is especially useful in validation
Attributes include
[Required]
Marks the property as non-optional
[DisplayName]
Overrides the default label of a property in the view
[StringLength(50), MinimumLength=3]
Sets a max length for a string property
[Range(0,5]
Provided value must be within a range](https://image.slidesharecdn.com/mvctraining-part2-150501084750-conversion-gate02/85/MVC-Training-Part-2-18-320.jpg)
Ad
More Related Content
What's hot (20)
Similar to MVC Training Part 2 (20)
Ad
More from Lee Englestone (11)
Ad
Recently uploaded (20)
![Pixologic ZBrush Crack Plus Activation Key [Latest 2025] New Version](https://cdn.slidesharecdn.com/ss_thumbnails/fashionevolution2-250322112409-f76abaa7-250428124909-b51264ff-250504160528-fc2bb1c5-thumbnail.jpg?width=560&fit=bounds)
MVC Training Part 2
- 1. ASP.NET MVC Training – Part 2 AN ASP.NET MVC INTRODUCTION Lee Englestone (@LeeEnglestone) Tech Lead @ Kitbag.com www.ManchesterDeveloper.com
- 2. Areas Areas group related Models, Views and Controllers By default no Areas exists They appear in the route like so http://www.website.com/{Area}/{Controller}/{Action}/{Id} You can try adding an Area to your application and you’ll see it creates a new folder and sub-folders for Models, Views and Controllers and the code to register the Area itself We don’t use Areas
- 3. HtmlHelpers HtmlHelpers are methods that can be executed within Razor views to generate HTML They are actually just extension methods and therefore you can write your own HtmlHelper methods The @Html.Action Helper method can be used to generate links given controller, actions names and id values We’ve already encountered @Html.LabelFor() and @Html.TextBoxFor() in Part 1
- 4. Partial Views A view that can be rendered in another view Conceptually similar to WebForms UserControls By convention located in the Views/Shared folder By convention prefixed with an underscore Can be returned from Controller Actions with a Model Next we’ll create a partial view that returns a picture of a cat
- 5. Exercise : Create and use a simple Partial View Create a new PartialView at Views/Shared/_FunnyCat.cshtml Put an image of a funny cat in /Images Update _FunnyCat.cshtml Add @Html.Partial(“FunnyCat”, “Steve”) to Index.html Run
- 6. Custom Mobile Views using DisplayModes Rules can be put into place to serve different views with different extensions in different circumstances A popular method is that if a user has requested a page on a mobile device and there are 2 versions of a View in the View folder Index.cshtml Index.mobile.cshtml Then the relevant view will be returned There is a built in DisplayMode for *.mobile.cshtml views
- 7. Exercise : Create Mobile View Create a new View called ViewsIndex.mobile.cshtml Make it obvious it is the Mobile View Run the application and emulate a Mobile device
- 8. CSS Boostrap Framework Bootstrap is a popular CSS and JavaScript framework that now is included in / used by new ASP.NET MVC Application projects http://getbootstrap.com/ It warrants a training course in itself (so check it out) but some of main things it gives are Browser reset Grid system Glyphicons Popovers, tooltips, tabs, modals, pagination
- 9. Dependency Injection A way of objecting dependencies Generally speaking we use Constructor Injection Constructor Injection
- 10. Exercise : Dependency Injection Add Ninject to MVC Application using NuGet Creates App_Start/NinjectWebCommon.cs Mappings can be put here in the format kernel.Bind<ISomeInterface>().To(SomeClass);
- 11. TDD/Unit Testing Controllers can be easily Unit Tested Can mock dependencies A few things you could Unit Test The View (or result) returned from an Action is of the correct type The Model returned from an Action is correct
- 12. Exercise : Unit Testing Controllers Create a new ClassLibrary called Tests and Reference NUnit using NuGet Add a reference in the class library to the Web Application Create a new File called HomeControllerTests.cs Assert that the Type of Model returned from the Index View on the controller is HomeViewModel
- 13. Bundling The merging together and serving of multiple files Instead of a request for each javascript/css file, files are ‘merged together’ to reduce number of requests Bundles defined in App_Start/BundleConfig.cs Can be turned off whilst debugging / working locally
- 14. Bundling
- 15. Minification The removing of whitespace in served javascript and css files Is done automatically to styles and scripts in a Bundle Can be turned off whilst debugging / working locally
- 16. Scaffolding Views It is possible to auto-generate the input fields for a Views Model properties @Html.EditorForModel() May have to ignore unwanted Model properties with [ScaffoldColumn(false)]
- 17. Exercise : Scaffolding View using Model Change the save form on the Index View to use @Html.EditorForModel() and run You should see most of the properties are provided with relevant inputs To tell the ‘auto-scaffolder’ to ignore certain properties, give the properties the [ScaffoldColumn(false)] attribute
- 18. Model Attributes Model properties can be given attributes to provide additional information about them This is especially useful in validation Attributes include [Required] Marks the property as non-optional [DisplayName] Overrides the default label of a property in the view [StringLength(50), MinimumLength=3] Sets a max length for a string property [Range(0,5] Provided value must be within a range
- 19. ModelState Once a Model has been posted back to an action we can check it’s ‘State’ and whether it is in a valid state Discussed in next slide
- 20. Exercise : Model Attributes for Validation Add some validation attributes to the HomeViewModel If the Model is Invalid we pass it back to the calling Action Continued..
- 21. Exercise : Model Attributes for Validation continued.. You can alter the Index View to use @Html.ValidationSummary() which will list all the errors on the Model Else by default validation messages will appear next to the relevant input controls @Html.ValidationSummary() Model property validation messages
- 22. Async Actions in Controllers Helps avoid HttpRequests from blocking requests Uses new async and await keywords in C#5 The return type is wrapped in Task<Something> Use on long Actions i.e. That call external apis That do file IO operations Actions on Controllers calling long running operations should be asynchronous Described well here.. http://stackoverflow.com/questions/190875 13/what-is-the-advantage-of-using-async- with-mvc5