CodeAPI

DisabledMixin

Provides functionality for elements that can be disabled.

Table of Contents

PROPERTIES

?
Store values associated with an object.
enabledIndicates if the element is enabled or disabled.

FUNCTIONS

?
Perform actions on an object.
disable( )Disables the element and sets its enabled property to false.
enable( )Enables the element and sets its enabled property to true.

enabled

Indicates if the element is enabled or disabled.

Description

If enabled is true, users can interact with the element.

If enabled is false, users cannot interact with the element.

When an element is disabled:

  • Its color is faded or grayed out.
  • Animations that the element normally exhibits when being interacting with do not occur.
  • Actions that the element has been configured to perform, such as opening a link, do not occur.
  • Event handlers that have been bound to the element, such as with onMouseIn, do not run.
  • If the element is an input element, such as a dropdown or text box, users cannot interact with it.

To set the enabled property of an element, use the element's enable() or disable() functions.

The enabled property can also be set in the Editor using the Properties panel.

See Also

disable( ), enable( )

Syntax

get enabled(): boolean
TYPE
?
The kind of data the property stores.
boolean
DEFAULT VALUE
?
The value of a property before you explicitly set it.
true

Examples

Get an element's enabled status

let isEnabled = $w("#myElement").enabled; // true

Toggle an element's enabled state

if( $w("#myElement").enabled ) {
  $w("#myElement").disable();
}
else {
  $w("#myElement").enable();
}

disable( )

Disables the element and sets its enabled property to false.

Description

The disable() function returns a Promise that is resolved when the element's enabled property has been set to false.

To learn about the behavior of a disabled element, see the enabled property.

See Also

enable( ), enabled

Syntax

function disable(): Promise<void>
RETURN VALUE
?
Value that a function evaluates to when it is finished running.
Promise<void>
Fulfilled - When the element's enabled property has been set to false.

Examples

Disable an element

$w("#myElement").disable();

Disable an element and log a message when done

$w("#myElement").disable()
  .then( () => {
    console.log("Element now disabled");
  } );

Toggle an element's enabled state

if( $w("#myElement").enabled ) {
  $w("#myElement").disable();
}
else {
  $w("#myElement").enable();
}

enable( )

Enables the element and sets its enabled property to true.

Description

The enable() function returns a Promise that is resolved when the element's enabled property has been set to true.

To learn about the behavior of an enabled element, see the enabled property.

See Also

disable( ), enabled

Syntax

function enable(): Promise<void>
RETURN VALUE
?
Value that a function evaluates to when it is finished running.
Promise<void>
Fulfilled - When the element's enabled property has been set to true.

Examples

Enable an element

$w("#myElement").enable();

Enable an element and log a message when done

$w("#myElement").enable()
  .then( () => {
    console.log("Element now enabled");
  } );

Toggle an element's enabled state

if( $w("#myElement").enabled ) {
  $w("#myElement").disable();
}
else {
  $w("#myElement").enable();
}