4.10.7.2 Common input element attributes — HTML5 (original) (raw)

4.10.7.1.13 Number state –Table of contents –4.10.8 The button element

1. 1. 1. 1. 4.10.7.2 Common input element attributes
            1. 4.10.7.2.1 The autocomplete attribute
            2. 4.10.7.2.2 The dirname attribute
            3. 4.10.7.2.3 The list attribute
            4. 4.10.7.2.4 The readonly attribute
            5. 4.10.7.2.5 The size attribute
            6. 4.10.7.2.6 The required attribute
            7. 4.10.7.2.7 The multiple attribute
            8. 4.10.7.2.8 The maxlength attribute
            9. 4.10.7.2.9 The pattern attribute
            10. 4.10.7.2.10 The min and max attributes
            11. 4.10.7.2.11 The step attribute
            12. 4.10.7.2.12 The placeholder attribute
            2. 4.10.7.3 Common input element APIs
            3. 4.10.7.4 Common event behaviors

4.10.7.2 Common [input](the-input-element.html#the-input-element) element attributes

These attributes only apply to an [input](the-input-element.html#the-input-element) element if its [type](the-input-element.html#attr-input-type) attribute is in a state whose definition declares that the attribute applies. When an attribute doesn't apply to an [input](the-input-element.html#the-input-element) element, user agents must ignore the attribute, regardless of the requirements and definitions below.

4.10.7.2.1 The [autocomplete](#attr-input-autocomplete) attribute

User agents sometimes have features for helping users fill forms in, for example prefilling the user's address based on earlier user input.

The autocomplete attribute is an enumerated attribute. The attribute has three states. The on keyword maps to the on state, and theoff keyword maps to the off state. The attribute may also be omitted. The missing value default is the default state.

The off state indicates either that the control's input data is particularly sensitive (for example the activation code for a nuclear weapon); or that it is a value that will never be reused (for example a one-time-key for a bank login) and the user will therefore have to explicitly enter the data each time, instead of being able to rely on the UA to prefill the value for him; or that the document provides its own autocomplete mechanism and does not want the user agent to provide autocompletion values.

Conversely, the on state indicates that the value is not particularly sensitive and the user can expect to be able to rely on his user agent to remember values he has entered for that control.

The default state indicates that the user agent is to use the [autocomplete](forms.html#attr-form-autocomplete) attribute on the element's form owner instead. (By default, the [autocomplete](forms.html#attr-form-autocomplete) attribute of[form](forms.html#the-form-element) elements is in the on state.)

Each [input](the-input-element.html#the-input-element) element has a resulting autocompletion state, which is either on or off.

When an [input](the-input-element.html#the-input-element) element is in one of the following conditions, the [input](the-input-element.html#the-input-element) element's resulting autocompletion state is on; otherwise, the[input](the-input-element.html#the-input-element) element's resulting autocompletion state is off:

• Its [autocomplete](#attr-input-autocomplete) attribute is in the on state.
• Its [autocomplete](#attr-input-autocomplete) attribute is in the default state, and the element has no form owner.
• Its [autocomplete](#attr-input-autocomplete) attribute is in the default state, and the element's form owner's [autocomplete](forms.html#attr-form-autocomplete) attribute is in the on state.

When an [input](the-input-element.html#the-input-element) element's resulting autocompletion state is on, the user agent may store the value entered by the user so that if the user returns to the page, the UA can prefill the form. Otherwise, the user agent should not remember the control's value, and should not offer past values to the user.

In addition, if the resulting autocompletion state is off, values are reset when traversing the history.

The autocompletion mechanism must be implemented by the user agent acting as if the user had modified the element's value, and must be done at a time where the element is mutable (e.g. just after the element has been inserted into the document, or when the user agent stops parsing).

Banks frequently do not want UAs to prefill login information:

Account:

PIN:

A user agent may allow the user to override the resulting autocompletion state and set it to always on, always allowing values to be remembered and prefilled), or always off, never remembering values. However, the ability to override the resulting autocompletion state to on should not be trivially accessible, as there are significant security implications for the user if all values are always remembered, regardless of the site's preferences.

4.10.7.2.2 The [dirname](#attr-input-dirname) attribute

The dirname attribute, when it applies, is a form control dirname attribute.

In this example, a form contains a text field and a submission button:

Comment:

Post Comment

When the user submits the form, the user agent includes three fields, one called "comment", one called "comment.dir", and one called "mode"; so if the user types "Hello", the submission body might be something like:

comment=Hello&comment.dir=ltr&mode=add

If the user manually switches to a right-to-left writing direction and enters "مرحبًا", the submission body might be something like:

comment=%D9%85%D8%B1%D8%AD%D8%A8%D9%8B%D8%A7&comment.dir=rtl&mode=add

4.10.7.2.3 The [list](#attr-input-list) attribute

The list attribute is used to identify an element that lists predefined options suggested to the user.

If present, its value must be the ID of a [datalist](the-button-element.html#the-datalist-element) element in the same document.

The suggestions source element is the first element in the document in tree order to have an ID equal to the value of the [list](#attr-input-list) attribute, if that element is a [datalist](the-button-element.html#the-datalist-element) element. If there is no [list](#attr-input-list) attribute, or if there is no element with that ID, or if the first element with that ID is not a [datalist](the-button-element.html#the-datalist-element) element, then there is no suggestions source element.

If there is a suggestions source element, then, when the user agent is allowing the user to edit the [input](the-input-element.html#the-input-element) element's value, the user agent should offer the suggestions represented by the suggestions source element to the user in a manner suitable for the type of control used. The user agent may use the suggestion's label to identify the suggestion if appropriate.

How user selections of suggestions are handled depends on whether the element is a control accepting a single value only, or whether it accepts multiple values:

If the element does not have a [multiple](#attr-input-multiple) attribute specified or if the [multiple](#attr-input-multiple) attribute does not apply

When the user selects a suggestion, the [input](the-input-element.html#the-input-element) element's value must be set to the selected suggestion's value, as if the user had written that value himself.

If the element does have a [multiple](#attr-input-multiple) attribute specified, and the [multiple](#attr-input-multiple) attribute does apply

When the user selects a suggestion, the user agent must either add a new entry to the [input](the-input-element.html#the-input-element) element's value_s_, whose value is the selected suggestion's value, or change an existing entry in the [input](the-input-element.html#the-input-element) element's value_s_ to have the value given by the selected suggestion's value, as if the user had himself added an entry with that value, or edited an existing entry to be that value. Which behavior is to be applied depends on the user interface in a user-agent-defined manner.

If the [list](#attr-input-list) attribute does not apply, there is no suggestions source element.

This URL field offers some suggestions.

Homepage:

Other URLs from the user's history might show also; this is up to the user agent.

This example demonstrates how to design a form that uses the autocompletion list feature while still degrading usefully in legacy user agents.

If the autocompletion list is merely an aid, and is not important to the content, then simply using a [datalist](the-button-element.html#the-datalist-element) element with children [option](the-button-element.html#the-option-element) elements is enough. To prevent the values from being rendered in legacy user agents, they should be placed inside the [value](the-button-element.html#attr-option-value) attribute instead of inline.

Enter a breed:

However, if the values need to be shown in legacy UAs, then fallback content can be placed inside the [datalist](the-button-element.html#the-datalist-element) element, as follows:

Enter a breed: or select one from the list:

The fallback content will only be shown in UAs that don't support [datalist](the-button-element.html#the-datalist-element). The options, on the other hand, will be detected by all UAs, even though they are not direct children of the [datalist](the-button-element.html#the-datalist-element) element.

Note that if an [option](the-button-element.html#the-option-element) element used in a[datalist](the-button-element.html#the-datalist-element) is [selected](the-button-element.html#attr-option-selected), it will be selected by default by legacy UAs (because it affects the[select](the-button-element.html#the-select-element)), but it will not have any effect on the[input](the-input-element.html#the-input-element) element in UAs that support[datalist](the-button-element.html#the-datalist-element).

4.10.7.2.4 The [readonly](#attr-input-readonly) attribute

The readonly attribute is a boolean attribute that controls whether or not the user can edit the form control. When specified, the element is immutable.

In the following example, the existing product identifiers cannot be modified, but they are still displayed as part of the form, for consistency with the row representing a new product (where the identifier is not yet filled in).

Add

Save

4.10.7.2.5 The [size](#attr-input-size) attribute

The size attribute gives the number of characters that, in a visual rendering, the user agent is to allow the user to see while editing the element's value.

The [size](#attr-input-size) attribute, if specified, must have a value that is a valid non-negative integer greater than zero.

4.10.7.2.6 The [required](#attr-input-required) attribute

The required attribute is a boolean attribute. When specified, the element is required.

Constraint validation: If the element is required, and its [value](#dom-input-value) IDL attribute applies and is in the mode value, and the element is mutable, and the element's value is the empty string, then the element is suffering from being missing.

The following form has two required fields, one for an e-mail address and one for a password. It also has a third field that is only considerd valid if the user types the same password in the password field and this third field.

Create new account

E-mail address:

Password:

Confirm password:

4.10.7.2.7 The [multiple](#attr-input-multiple) attribute

The multiple attribute is a boolean attribute that indicates whether the user is to be allowed to specify more than one value.

The following extract shows how an e-mail client's "Cc" field could accept multiple e-mail addresses.

Cc:

If the user had, amongst many friends in his user contacts database, two friends "Arthur Dent" (with address "art@example.net") and "Adam Josh" (with address "adamjosh@example.net"), then, after the user has typed "a", the user agent might suggest these two e-mail addresses to the user.

The page could also link in the user's contacts database from the site:

Cc: ...

Suppose the user had entered "bob@example.net" into this text field, and then started typing a second e-mail address starting with "a". The user agent might show both the two friends mentioned earlier, as well as the "astrophy" and "astronomy" values given in the [datalist](the-button-element.html#the-datalist-element) element.

The following extract shows how an e-mail client's "Attachments" field could accept multiple files for upload.

Attachments:

4.10.7.2.8 The [maxlength](#attr-input-maxlength) attribute

The maxlength attribute, when it applies, is a form control maxlength attribute controlled by the [input](the-input-element.html#the-input-element) element's dirty value flag.

If the [input](the-input-element.html#the-input-element) element has a maximum allowed value length, then the code-point length of the value of the element's [value](the-input-element.html#attr-input-value) attribute must be equal to or less than the element's maximum allowed value length.

The following extract shows how a messaging client's text entry could be arbitrarily restricted to a fixed number of characters, thus forcing any conversation through this medium to be terse and discouraging intelligent discourse.

What are you doing?

4.10.7.2.9 The [pattern](#attr-input-pattern) attribute

The pattern attribute specifies a regular expression against which the control'svalue, or, when the [multiple](#attr-input-multiple) attribute applies and is set, the control's value_s_, are to be checked.

If specified, the attribute's value must match the JavaScript Pattern production. [ECMA262]

If an [input](the-input-element.html#the-input-element) element has a [pattern](#attr-input-pattern) attribute specified, and the attribute's value, when compiled as a JavaScript regular expression with the global, ignoreCase, and multiline flags disabled (see ECMA262 Edition 5, sections 15.10.7.2 through 15.10.7.4), compiles successfully, then the resulting regular expression is the element's compiled pattern regular expression. If the element has no such attribute, or if the value doesn't compile successfully, then the element has nocompiled pattern regular expression. [ECMA262]

Constraint validation: If the element's value is not the empty string, and either the element's [multiple](#attr-input-multiple) attribute is not specified or it does not apply to the [input](the-input-element.html#the-input-element) element given its [type](the-input-element.html#attr-input-type) attribute's current state, and the element has a compiled pattern regular expression but that regular expression does not match the entirety of the element's value, then the element issuffering from a pattern mismatch.

Constraint validation: If the element's value is not the empty string, and the element's [multiple](#attr-input-multiple) attribute is specified and applies to the [input](the-input-element.html#the-input-element) element, and the element has a compiled pattern regular expression but that regular expression does not match the entirety of each of the element's value_s_, then the element is suffering from a pattern mismatch.

This implies that the regular expression language used for this attribute is the same as that used in JavaScript, except that the [pattern](#attr-input-pattern) attribute must match the entire value, not just any subset (somewhat as if it implied a ^(?: at the start of the pattern and a )$ at the end).

When an [input](the-input-element.html#the-input-element) element has a [pattern](#attr-input-pattern) attribute specified, authors should include a [title](elements.html#the-title-attribute) attribute to give a description of the pattern. User agents may use the contents of this attribute, if it is present, when informing the user that the pattern is not matched, or at any other suitable time, such as in a tooltip or read out by assistive technology when the control gains focus.

For example, the following snippet:

Part number:

...could cause the UA to display an alert such as:

A part number is a digit followed by three uppercase letters. You cannot submit this form when the field is incorrect.

When a control has a [pattern](#attr-input-pattern) attribute, the [title](elements.html#the-title-attribute) attribute, if used, must describe the pattern. Additional information could also be included, so long as it assists the user in filling in the control. Otherwise, assistive technology would be impaired.

For instance, if the title attribute contained the caption of the control, assistive technology could end up saying something like The text you have entered does not match the required pattern. Birthday, which is not useful.

UAs may still show the [title](semantics.html#the-title-element) in non-error situations (for example, as a tooltip when hovering over the control), so authors should be careful not to word [title](semantics.html#the-title-element)s as if an error has necessarily occurred.

4.10.7.2.10 The [min](#attr-input-min) and [max](#attr-input-max) attributes

The min and max attributes indicate the allowed range of values for the element.

Their syntax is defined by the section that defines the [type](the-input-element.html#attr-input-type) attribute's current state.

If the element has a [min](#attr-input-min) attribute, and the result of applying the algorithm to convert a string to a number to the value of the [min](#attr-input-min) attribute is a number, then that number is the element's minimum; otherwise, if the [type](the-input-element.html#attr-input-type) attribute's current state defines a default minimum, then that is the minimum; otherwise, the element has no minimum.

Constraint validation: When the element has aminimum, and the result of applying the algorithm to convert a string to a number to the string given by the element's value is a number, and the number obtained from that algorithm is less than the minimum, the element issuffering from an underflow.

The [min](#attr-input-min) attribute also defines the step base.

If the element has a [max](#attr-input-max) attribute, and the result of applying the algorithm to convert a string to a number to the value of the [max](#attr-input-max) attribute is a number, then that number is the element's maximum; otherwise, if the [type](the-input-element.html#attr-input-type) attribute's current state defines a default maximum, then that is the maximum; otherwise, the element has no maximum.

Constraint validation: When the element has amaximum, and the result of applying the algorithm to convert a string to a number to the string given by the element's value is a number, and the number obtained from that algorithm is more than the maximum, the element issuffering from an overflow.

The [max](#attr-input-max) attribute's value (the maximum) must not be less than the [min](#attr-input-min) attribute's value (its minimum).

An element has range limitations if it has a defined minimum or a defined maximum.

The following date control limits input to dates that are before the 1980s:

The following number control limits input to whole numbers greater than zero:

4.10.7.2.11 The [step](#attr-input-step) attribute

The step attribute indicates the granularity that is expected (and required) of the value, by limiting the allowed values. The section that defines the[type](the-input-element.html#attr-input-type) attribute's current state also defines the default step, the step scale factor, and in some cases the default step base, which are used in processing the attribute as described below.

The [step](#attr-input-step) attribute, if specified, must either have a value that is a valid floating point number that parses to a number that is greater than zero, or must have a value that is an ASCII case-insensitive match for the string "any".

The attribute provides the allowed value step for the element, as follows:

1. If the attribute is absent, then the allowed value step is the default step multiplied by the step scale factor.
2. Otherwise, if the attribute's value is an ASCII case-insensitive match for the string "any", then there is no allowed value step.
3. Otherwise, if the rules for parsing floating point number values, when they are applied to the attribute's value, return an error, zero, or a number less than zero, then the allowed value step is the default step multiplied by the step scale factor.
4. Otherwise, the allowed value step is the number returned by the rules for parsing floating point number values when they are applied to the attribute's value, multiplied by the step scale factor.

The step base is the result of applying the algorithm to convert a string to a number to the value of the [min](#attr-input-min) attribute, unless the element does not have a [min](#attr-input-min) attribute specified or the result of applying that algorithm is an error, in which case the step base is the default step base, if one is defined, or zero, if not.

Constraint validation: When the element has anallowed value step, and the result of applying the algorithm to convert a string to a number to the string given by the element's value is a number, and that number subtracted from the step base is not an integral multiple of the allowed value step, the element issuffering from a step mismatch.

The following range control only accepts values in the range 0..1, and allows 256 steps in that range:

The following control allows any time in the day to be selected, with any accuracy (e.g. thousandth-of-a-second accuracy or more):

Normally, time controls are limited to an accuracy of one minute.

4.10.7.2.12 The [placeholder](#attr-input-placeholder) attribute

The placeholder attribute represents a short hint (a word or short phrase) intended to aid the user with data entry. A hint could be a sample value or a brief description of the expected format. The attribute, if specified, must have a value that contains no U+000A LINE FEED (LF) or U+000D CARRIAGE RETURN (CR) characters.

For a longer hint or other advisory text, the [title](elements.html#the-title-attribute) attribute is more appropriate.

The [placeholder](#attr-input-placeholder) attribute should not be used as an alternative to a[label](forms.html#the-label-element).

User agents should present this hint to the user, after havingstripped line breaks from it, when the element's value is the empty string and the control is not focused (e.g. by displaying it inside a blank unfocused control).

Here is an example of a mail configuration user interface that uses the [placeholder](#attr-input-placeholder) attribute:

Name:

Address:

Password:

Description:

4.10.7.3 Common [input](the-input-element.html#the-input-element) element APIs

input . [value](#dom-input-value) [ = value ]

Returns the current value of the form control.

Can be set, to change the value.

Throws an [INVALID_STATE_ERR](common-dom-interfaces.html#invalid%5Fstate%5Ferr) exception if it is set to any value other than the empty string when the control is a file upload control.

input . [checked](#dom-input-checked) [ = value ]

Returns the current checkedness of the form control.

Can be set, to change the checkedness.

input . [files](#dom-input-files)

Returns a [FileList](infrastructure.html#filelist) object listing the selected files of the form control.

Returns null if the control isn't a file control.

input . [valueAsDate](#dom-input-valueasdate) [ = value ]

Returns a Date object representing the form control's value, if applicable; otherwise, returns null.

Can be set, to change the value.

Throws an [INVALID_STATE_ERR](common-dom-interfaces.html#invalid%5Fstate%5Ferr) exception if the control isn't date- or time-based.

input . [valueAsNumber](#dom-input-valueasnumber) [ = value ]

Returns a number representing the form control's value, if applicable; otherwise, returns null.

Can be set, to change the value.

Throws an [INVALID_STATE_ERR](common-dom-interfaces.html#invalid%5Fstate%5Ferr) exception if the control is neither date- or time-based nor numeric.

input . [stepUp](#dom-input-stepup)( [ n ] )

input . [stepDown](#dom-input-stepdown)( [ n ] )

Changes the form control's value by the value given in the[step](#attr-input-step) attribute, multiplied byn. The default value for n is 1.

Throws [INVALID_STATE_ERR](common-dom-interfaces.html#invalid%5Fstate%5Ferr) exception if the control is neither date- or time-based nor numeric, if the [step](#attr-input-step) attribute's value is "any", if the current value could not be parsed, or if stepping in the given direction by the given amount would take the value out of range.

input . [list](#dom-input-list)

Returns the [datalist](the-button-element.html#the-datalist-element) element indicated by the[list](#attr-input-list) attribute.

input . [selectedOption](#dom-input-selectedoption)

Returns the [option](the-button-element.html#the-option-element) element from the[datalist](the-button-element.html#the-datalist-element) element indicated by the [list](#attr-input-list) attribute that matches the form control's value.

The value IDL attribute allows scripts to manipulate the value of an [input](the-input-element.html#the-input-element) element. The attribute is in one of the following modes, which define its behavior:

value

On getting, it must return the current value of the element. On setting, it must set the element's value to the new value, set the element's dirty value flag to true, and then invoke the value sanitization algorithm, if the element's [type](the-input-element.html#attr-input-type) attribute's current state defines one.

default

On getting, if the element has a [value](the-input-element.html#attr-input-value) attribute, it must return that attribute's value; otherwise, it must return the empty string. On setting, it must set the element's [value](the-input-element.html#attr-input-value) attribute to the new value.

default/on

On getting, if the element has a [value](the-input-element.html#attr-input-value) attribute, it must return that attribute's value; otherwise, it must return the string "on". On setting, it must set the element's[value](the-input-element.html#attr-input-value) attribute to the new value.

filename

On getting, it must return the string "C:\fakepath\" followed by the filename of the first file in the list of selected files, if any, or the empty string if the list is empty. On setting, if the new value is the empty string, it must empty the list of selected files; otherwise, it must throw an [INVALID_STATE_ERR](common-dom-interfaces.html#invalid%5Fstate%5Ferr) exception.

This "fakepath" requirement is a sad accident of history. See the example in the File Upload state section for more information.

The checked IDL attribute allows scripts to manipulate the checkedness of an[input](the-input-element.html#the-input-element) element. On getting, it must return the currentcheckedness of the element; and on setting, it must set the element's checkedness to the new value and set the element's dirty checkedness flag to true.

The files IDL attribute allows scripts to access the element's selected files. On getting, if the IDL attribute applies, it must return a[FileList](infrastructure.html#filelist) object that represents the current selected files. The same object must be returned until the list of selected files changes. If the IDL attribute does not apply, then it must instead return null. [FILEAPI]

The valueAsDate IDL attribute represents the value of the element, interpreted as a date.

On getting, if the [valueAsDate](#dom-input-valueasdate) attribute does not apply, as defined for the [input](the-input-element.html#the-input-element) element's [type](the-input-element.html#attr-input-type) attribute's current state, then return null. Otherwise, run the algorithm to convert a string to a Date object defined for that state; if the algorithm returned a Date object, then return it, otherwise, return null.

On setting, if the [valueAsDate](#dom-input-valueasdate) attribute does not apply, as defined for the [input](the-input-element.html#the-input-element) element's [type](the-input-element.html#attr-input-type) attribute's current state, then throw an [INVALID_STATE_ERR](common-dom-interfaces.html#invalid%5Fstate%5Ferr) exception; otherwise, if the new value is null, then set the value of the element to the empty string; otherwise, run the algorithm to convert aDate object to a string, as defined for that state, on the new value, and set the value of the element to resulting string.

The valueAsNumber IDL attribute represents the value of the element, interpreted as a number.

On getting, if the [valueAsNumber](#dom-input-valueasnumber) attribute does not apply, as defined for the [input](the-input-element.html#the-input-element) element's [type](the-input-element.html#attr-input-type) attribute's current state, then return a Not-a-Number (NaN) value. Otherwise, if the [valueAs_Date_](#dom-input-valueasdate) attribute applies, run the algorithm to convert a string to a Date object defined for that state; if the algorithm returned a Date object, then return the time value of the object (the number of milliseconds from midnight UTC the morning of 1970-01-01 to the time represented by the Date object), otherwise, return a Not-a-Number (NaN) value. Otherwise, run the algorithm to convert a string to a number defined for that state; if the algorithm returned a number, then return it, otherwise, return a Not-a-Number (NaN) value.

On setting, if the [valueAsNumber](#dom-input-valueasnumber) attribute does not apply, as defined for the [input](the-input-element.html#the-input-element) element's [type](the-input-element.html#attr-input-type) attribute's current state, then throw an [INVALID_STATE_ERR](common-dom-interfaces.html#invalid%5Fstate%5Ferr) exception. Otherwise, if the [valueAs_Date_](#dom-input-valueasdate) attribute applies, run the algorithm to convert aDate object to a string defined for that state, passing it a Date object whose time value is the new value, and set the value of the element to resulting string. Otherwise, run the algorithm to convert a number to a string, as defined for that state, on the new value, and set the value of the element to resulting string.

The stepDown(n) and stepUp(n) methods, when invoked, must run the following algorithm:

1. If the [stepDown()](#dom-input-stepdown) and[stepUp()](#dom-input-stepup) methods do not apply, as defined for the [input](the-input-element.html#the-input-element) element's [type](the-input-element.html#attr-input-type) attribute's current state, then throw an [INVALID_STATE_ERR](common-dom-interfaces.html#invalid%5Fstate%5Ferr) exception, and abort these steps.
2. If the element has no allowed value step, then throw an[INVALID_STATE_ERR](common-dom-interfaces.html#invalid%5Fstate%5Ferr) exception, and abort these steps.
3. If applying the algorithm to convert a string to a number to the string given by the element'svalue results in an error, then throw an [INVALID_STATE_ERR](common-dom-interfaces.html#invalid%5Fstate%5Ferr) exception, and abort these steps; otherwise, let value be the result of that algorithm.
4. Let n be the argument, or 1 if the argument was omitted.
5. Let delta be the allowed value step multiplied byn.
6. If the method invoked was the [stepDown()](#dom-input-stepdown) method, negate delta.
7. Let value be the result of adding delta to value.
8. If the element has a minimum, and the value is less than that minimum, then throw a[INVALID_STATE_ERR](common-dom-interfaces.html#invalid%5Fstate%5Ferr) exception.
9. If the element has a maximum, and the value is greater than that maximum, then throw a[INVALID_STATE_ERR](common-dom-interfaces.html#invalid%5Fstate%5Ferr) exception.
10. Let value as string be the result of running the algorithm to convert a number to a string, as defined for the [input](the-input-element.html#the-input-element) element's [type](the-input-element.html#attr-input-type) attribute's current state, on value.
11. Set the value of the element to value as string.

The list IDL attribute must return the current suggestions source element, if any, or null otherwise.

The selectedOption IDL attribute must return the value determined by the following steps:

1. If there is no suggestions source element (e.g. because the [list](#attr-input-list) attribute doesn't apply or is not specified), then return null and abort these steps.
2. If the [multiple](#attr-input-multiple) attribute is specified and applies, then return null and abort these steps. (The [selectedOption](#dom-input-selectedoption) IDL attribute doesn't apply.)
3. Return the first [option](the-button-element.html#the-option-element) element, in tree order, to be a child of the suggestions source element and whose value matches the[input](the-input-element.html#the-input-element) element's value, if any. If the suggestions source element contains no matching [option](the-button-element.html#the-option-element) element, then return null instead.

4.10.7.4 Common event behaviors

When the input event applies, any time the user causes the element's value to change, the user agent mustqueue a task to fire a simple event that bubbles named input at the[input](the-input-element.html#the-input-element) element. User agents may wait for a suitable break in the user's interaction before queuing the task; for example, a user agent could wait for the user to have not hit a key for 100ms, so as to only fire the event when the user pauses, instead of continuously for each keystroke.

Examples of a user changing the element's value would include the user typing into a text field, pasting a new value into the field, or undoing an edit in that field. Some user interactions do not cause changes to the value, e.g. hitting the "delete" key in an empty text field, or replacing some text in the field with text from the clipboard that happens to be exactly the same text.

When the change event applies, if the element does not have an activation behavior defined but uses a user interface that involves an explicit commit action, then any time the user commits a change to the element'svalue or list of selected files, the user agent must queue a task to fire a simple event that bubbles named change at the [input](the-input-element.html#the-input-element) element.

An example of a user interface with a commit action would be a File Upload control that consists of a single button that brings up a file selection dialog: when the dialog is closed, if that thefile selection changed as a result, then the user has committed a new file selection.

Another example of a user interface with a commit action would be a Date control that allows both text-based user input and user selection from a drop-down calendar: while text input might not have an explicit commit step, selecting a date from the drop down calendar and then dismissing the drop down would be a commit action.

When the user agent changes the element's value on behalf of the user (e.g. as part of a form prefilling feature), the user agent must follow these steps:

1. If the [input](#event-input-input) event applies, queue a task to fire a simple event that bubbles named input at the [input](the-input-element.html#the-input-element) element.
2. If the [change](#event-input-change) event applies, queue a task to fire a simple event that bubbles named change at the [input](the-input-element.html#the-input-element) element.

In addition, when the [change](#event-input-change) event applies, change events can also be fired as part of the element's activation behavior and as part of theunfocusing steps.

The task source for these tasks is the user interaction task source.