Search.../

onChange( )

Adds an event handler that runs when an input element's value is changed.

Description

An element receives a change event when a user changes the value in an input element.

A change event is not triggered when you change an element's value using the element's value property.

Because onChange() is fired before validations are performed, do not check any of the validation properties in the onChange() event handler. For example, do not code an if statement that checks the valid property in the onChange() because the property at this point contains values prior to the onChange().

Deprecation note: The $w parameter of event handlers is being deprecated. To get a scoped selector for working with elements in repeater items, use the $w.at() function and pass it the context property of the event parameter: $item = $w.at(event.context). To learn more, see here.

Syntax

function onChange(handler: EventHandler): Element
handler: function EventHandler(event: Event, $w: $w): void

onChange Parameters

NAME
TYPE
DESCRIPTION
handler

EventHandler

The name of the function or the function expression to run when the element's value changes.

Returns

The element on which the event is now registered.

Return Type:

EventHandler Parameters

NAME
TYPE
DESCRIPTION
event

Event

The event that occurred.

$w

$w

Deprecated: A selector function. The $w function was used to enable event handlers to work with elements in repeaters. Now, to get a scoped selector for working with repeater items, use the $w.at() function and pass it the context property of the event parameter: $item = $w.at(event.context).

Returns

This function does not return anything.

Return Type:

void
Mixed in from:$w.FormElement

Was this helpful?

Get the value of the element that was changed

Code Example

Copy Code
1$w("#myElement").onChange( (event) => {
2 let newValue = event.target.value; // "new value"
3});