BTI420 notes – Thu Jan 29 and Mon Feb 2

HTML Helpers introduction. Using a ‘select list’ object to work with list-based HTML Form elements.

.

Get started with HTML Helpers

The textbook has good coverage of this topic in chapter 5, “Forms and HTML Helpers”.

You have seen how easy it is to write code for views. Also, you recently learned about the “scaffolding” topic, and noticed that scaffolded views included code expressions that began with “Html”. These are HTML Helpers, which are intended to make some of the HTML easier to write.

HTML Helpers offer these benefits:

  • Link (URI) resolution at runtime
  • Less code required to render some HTML Forms elements
  • Model binding
  • User interface support for interaction and error message display

.

Simple helpers

  • ActionLink – i.e. HTML.ActionLink()

As you will see on the “Login” page, you can also use the Textbox and Password helpers. However, they get more useful when there’s a model object involved.

.

Helpers used with view model data

Helpers offer more benefits when used with view model data (specifically model binding, and user interface support). You can use these helpers:

  • Textbox
  • Password
  • Label
  • TextArea
  • DropDownList
  • Listbox

.

View model class for an HTML Form

You should create a custom view model class when you have an HTML Form that needs to be configured.

For example, your HTML Form may need to display a drop-down list, or a radio button group. In that situation, simply add a SelectList property to the view model class (for each ‘list’ element).

Then, in the controller, configure the select list with the data collection that will be used for the HTML Form ‘list’ element.

.

SelectList object for HTML Forms

Read this document for a thorough treatment of an…

ASP.NET MVC view model class with SelectList

.

Hands-on with Lab 3

Lab 3 enables you to implement recent topics, including:

  • Biggy data store
  • Manager class
  • AutoMapper
  • Scaffolded controller and views
  • HTML Helpers
  • SelectList object

.

.

.

.

.

.

.

.

.

.

.

.

.

.

  1. No comments yet.
  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: