$w.DisabledMixin

$w.DisabledMixin

Provides functionality for elements that can be disabled.

Contents

enabled Indicates if the element is enabled or disabled.
disable( ) Disables the element and sets its enabled property to false.
enable( ) Enables the element and sets its enabled property to true.
enabled

enabled

Indicates if the element is enabled or disabled.

Syntax

get enabled(): boolean

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.

Type

Boolean

Examples

Get an element's enabled status

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

Toggle an element's enabled state

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

Default Value

true

See Also

disable( ), enable( )

disable( )

disable( )

Disables the element and sets its enabled property to false.

function disable(): Promise<void>

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.

Return Value

Returns a Promise

On fulfillment void When the element's enabled property has been set to false.

Examples

Disable an element

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

Disable an element and log a message when done

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

Toggle an element's enabled state

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

See Also

enable( ), enabled

enable( )

enable( )

Enables the element and sets its enabled property to true.

function disable(): Promise<void>

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.

Return Value

Returns a Promise

On fulfillment void When the element's enabled property has been set to true.

Examples

Enable an element

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

Enable an element and log a message when done

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

Toggle an element's enabled state

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

See Also

disable( ), enabled