$w.HtmlComponentMessageEvent

$w.HtmlComponentMessageEvent

Event that is fired when the code in an HtmlComponent sends a message.

Mixes In

$w.Event

Contents

context Gets the context of the event on a repeated element.
data Gets the event data.
target Gets the element that the event was fired on.
type Gets the type of event that was fired.
context

context

Gets the context of the event on a repeated element.

Syntax

get context(): Object

Description

The context property only appears in events on repeated elements.

It contains an object with one key:value pair. The key is "itemId" and the value is the ID of the repeated item on which the event occurred.

Type

Object

Examples

Get the context of the event

JHcoIiNteVJlcGVhdGVkRWxlbWVudCIpLm9uRXZlbnQoIChldmVudCwgJHcpID0+IHsKICBsZXQgaXRlbUlkID0gZXZlbnQuY29udGV4dC5pdGVtSWQ7ICAvLyAiaXRlbTEiCn0gKTsK
$w("#myRepeatedElement").onEvent( (event, $w) => {
  let itemId = event.context.itemId;  // "item1"
} );

Mixed In From

$w.Event

data

data

Gets the event data.

Syntax

get data(): string

Type

Element

Examples

Receive a message from an HTML Component

JHcoIiNteUh0bWxDb21wb25lbnQiKS5vbk1lc3NhZ2UoIChldmVudCwgJHcpID0+IHsKICBsZXQgcmVjZWl2ZWRNZXNzYWdlID0gZXZlbnQuZGF0YTsKfSApOwo=
$w("#myHtmlComponent").onMessage( (event, $w) => {
  let receivedMessage = event.data;
} );
target

target

Gets the element that the event was fired on.

Syntax

get target(): string

Type

Element

Examples

Get the ID of the target element

JHcoIiNteUVsZW1lbnQiKS5vbkV2ZW50KCAoZXZlbnQsICR3KSA9PiB7CiAgbGV0IHRhcmdldElkID0gZXZlbnQudGFyZ2V0LmlkOyAgLy8gIm15RWxlbWVudCIKfSApOwo=
$w("#myElement").onEvent( (event, $w) => {
  let targetId = event.target.id;  // "myElement"
} );

Mixed In From

$w.Event

type

type

Gets the type of event that was fired.

Syntax

get type(): string

Type

String

Examples

Get the type of the event

JHcoIiNteUVsZW1lbnQiKS5vbkV2ZW50KCAoZXZlbnQsICR3KSA9PiB7CiAgbGV0IGV2ZW50VHlwZSA9IGV2ZW50LnR5cGU7IC8vICJjbGljayIKfSApOwo=
$w("#myElement").onEvent( (event, $w) => {
  let eventType = event.type; // "click"
} );

Mixed In From

$w.Event