$w.TableRowEvent

$w.TableRowEvent

Event that is fired when a table row is selected.

This event is only fired if the table is set in the Editor to select rows when clicked. Clicking Selects Rows

Mixes In

$w.Event

Contents

context Gets the context of the event on a repeated element.
rowData Gets the data for the selected row.
rowIndex Gets the index of the selected row.
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

rowData

rowData

Gets the data for the selected row.

Syntax

get rowData(): Object

Description

The row data is a JSON object of columnName:cellData key:value pairs. The object only contains the data that is displayed in the table.

If the table is connected to a dataset, the rowData does not include the fields from the dataset item that are not connected to table columns.

To retrieve the dataset item data that corresponds to the table row data, use the dataset getCurrentItem() function in the dataset onCurrentIndexChanged() event handler.

Getting the rowData gets the same object that is returned in the array of rows when readingthe table's rows property.

Type

Object

Examples

Get the selected table row information

JHcoIiNteVRhYmxlIikub25Sb3dTZWxlY3QoIChldmVudCwgJHcpID0+IHsKICBsZXQgcm93RGF0YSA9IGV2ZW50LnJvd0RhdGE7ICAgIC8vIHsiZk5hbWUiOiAiSm9obiIsICJsTmFtZSI6ICJEb2UifQogIGxldCByb3dJbmRleCA9IGV2ZW50LnJvd0luZGV4OyAgLy8gMgp9ICk7Cg==
$w("#myTable").onRowSelect( (event, $w) => {
  let rowData = event.rowData;    // {"fName": "John", "lName": "Doe"}
  let rowIndex = event.rowIndex;  // 2
} );

Get the full item information from the dataset

JHcoIiNteVRhYmxlIikub25Sb3dTZWxlY3QoIChldmVudCwgJHcpID0+IHsKICBsZXQgcm93RGF0YSA9IGV2ZW50LnJvd0RhdGE7Cn0gKTsKCi8vIC4uLgoKJHcoIiNteURhdGFzZXQiKS5vbkN1cnJlbnRJbmRleENoYW5nZWQoIChldmVudCwgJHcpID0+IHsKICBsZXQgaXRlbURhdGEgPSAkdygiI215RGF0YXNldCIpLmdldEN1cnJlbnRJdGVtKCk7Cn0gKTsKCi8qIHJvd0RhdGE6CiAqIHsKICogICJmTmFtZSI6ICAiSm9obiIsCiAqICAibE5hbWUiOiAgIkRvZSIKICogfQogKgogKiBpdGVtRGF0YToKICogewogKiAgIl9pZCI6ICAgICAgICAgICJlNjg5NWE3Ni0zYTg5LTRhYTctOGY2YS0wMjMwNjFjZDhjMjQiLAogKiAgIl9vd25lciI6ICAgICAgICJmZGtyOTloay1naDk0LWY4aTQtY2Q4ZS1zbzQzMDlkc2szZjMiLAogKiAgIl9jcmVhdGVkRGF0ZSI6ICIyMDE3LTAzLTE2VDA5OjA4OjQxLjgyNloiLAogKiAgIl91cGRhdGVkRGF0ZSI6ICIyMDE3LTAzLTE2VDA5OjA4OjU4LjQ3NloiLAogKiAgImZOYW1lIjogICAgICAgICJKb2huIiwKICogICJsTmFtZSI6ICAgICAgICAiRG9lIgogKiB9CiAqLwo=
$w("#myTable").onRowSelect( (event, $w) => {
  let rowData = event.rowData;
} );

// ...

$w("#myDataset").onCurrentIndexChanged( (event, $w) => {
  let itemData = $w("#myDataset").getCurrentItem();
} );

/* rowData:
 * {
 *  "fName":  "John",
 *  "lName":  "Doe"
 * }
 *
 * itemData:
 * {
 *  "_id":          "e6895a76-3a89-4aa7-8f6a-023061cd8c24",
 *  "_owner":       "fdkr99hk-gh94-f8i4-cd8e-so4309dsk3f3",
 *  "_createdDate": "2017-03-16T09:08:41.826Z",
 *  "_updatedDate": "2017-03-16T09:08:58.476Z",
 *  "fName":        "John",
 *  "lName":        "Doe"
 * }
 */
rowIndex

rowIndex

Gets the index of the selected row.

Syntax

get rowIndex(): Number

Description

The rows in a table are zero-based and do not include the table header. Table Row Numbering

Type

Number

Examples

Get the selected table row information

JHcoIiNteVRhYmxlIikub25Sb3dTZWxlY3QoIChldmVudCwgJHcpID0+IHsKICBsZXQgcm93RGF0YSA9IGV2ZW50LnJvd0RhdGE7ICAgIC8vIHsiZk5hbWUiOiAiSm9obiIsICJsTmFtZSI6ICJEb2UifQogIGxldCByb3dJbmRleCA9IGV2ZW50LnJvd0luZGV4OyAgLy8gMgp9ICk7Cg==
$w("#myTable").onRowSelect( (event, $w) => {
  let rowData = event.rowData;    // {"fName": "John", "lName": "Doe"}
  let rowIndex = event.rowIndex;  // 2
} );
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