In line with continued support for HTML5 in Dreamweaver, new attributes have been introduced for some form elements. In addition, four new HTML5 form elements have been introduced.
You can locate the form elements in the Insert panel. Select Window > Insert. In the Insert panel menu, select Forms.
Revised Forms workflow in Dreamweaver
The following new attributes are common to all form elements:
- Disabled: Select this option if you want the browser to disable the element
- Required: Select this option if you want the browser to check if a value has been specified
- Auto complete: Select this option to auto fill values when user enters information in a browser.
- Auto focus: Select this option if you want the focus to be on this element when browser loads the page.
- Read only: Select this option to set the value of the element to read-only.
- Form: Specifies one or more forms to which an <input> element belongs.
- Name: Unique name used to reference the element in the code.
- Place holder: Hint that describes the expected value of an input field
- Pattern: Regular expression against which the element's value is validated.
- Title: Extra information about an element. Displayed as a tool tip.
- Tab Index: Specifies the position of the current element in the tab order for the current document.
- Form No Validate: Select this option to disable form validation. This selection overrides the No Validate attribute at form level.
- Form Enc Type: A MIME type with which a user agent is meant to associate this element for form submission.
- Form Target: A browsing context name or keyword that represents the target of the control.
- Accept charset: Specifies the character encodings used for form submission.
Opomba:
The links for attributes contain information on all attributes listed in the HTML5 specifications. Not all these attributes are present in the Properties panel. You can use the code view to add attributes not present in the panel.
Form element | Available in | Description | Description of attributes |
Color | 12.2 | For input fields that should contain a color. | http://www.w3.org/TR/html-markup/input.color.html |
Date | 12.2 | Control that helps the user select a date. | http://www.w3.org/TR/html-markup/input.date.html |
Date Time | 12.2 | Allows the user to select a date and time (with the time zone). | http://www.w3.org/TR/html-markup/input.datetime.html |
Date Time Local | 12.2 | Allows the user to select a date and time (no time zone) | http://www.w3.org/TR/html-markup/input.datetime-local.html |
Month | 12.2 | Allows the user to select a month and year. | http://www.w3.org/TR/html-markup/input.month.html |
Number | 12.2 | For fields that should contain only numbers. | http://www.w3.org/TR/html-markup/input.number.html |
Range | 12.2 | For fields that should contain values from a range of numbers. | http://www.w3.org/TR/html-markup/input.range.html |
Time | 12.2 | Allows the user to select a time. | http://www.w3.org/TR/html-markup/input.time.html |
Week | 12.2 | Allows the user to select a week and year. | http://www.w3.org/TR/html-markup/input.week.html |
12.1 | A control for editing a list of email addresses given in the element’s value. | http://www.w3.org/TR/html-markup/input.email.html | |
Search | 12.1 | A one-line plain-text edit control for entering one or more search terms. | http://www.w3.org/TR/html-markup/input.search.html |
Telephone (Tel) | 12.1 | A one-line plain-text edit control for entering a telephone number. | http://www.w3.org/TR/html-markup/input.tel.html |
URL | 12.1 | A control for editing an absolute URL given in the element’s value. | http://www.w3.org/TR/html-markup/input.url.html |