CodeAPI

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.

Table of Contents

PROPERTIES

?
Store values associated with an object.
contextGets the context of the event on a repeated element.
rowDataGets the data for the selected row.
rowIndexGets the index of the selected row.
targetGets the element that the event was fired on.
typeGets the type of event that was fired.

MIXES IN

?
Where some functionality is inherited from.
$w.Event

context

Gets the context of the event on a repeated element.

Description

An event's context contains information about the circumstances surrounding the firing of the event. The context property only appears in events on repeated elements.

You can use the evnet context with $w.at() to get a selector function which selects items from a specific repeater item. 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.

Syntax

get context(): EventContext

MIXED IN FROM

?
Where this functionality is inherited from.
$w.Event

Examples

Get the context of the event

// non-repeater event

$w("#myElement").onEvent( (event) => {
  let type = event.context.type; // "GLOBAL_SCOPE"
} );


// repeater event

$w("#myRepeatedElement").onEvent( (event) => {
  let $item = $w.at(event.context)
  $item("#anotherRepeatedElement").value = "new value";

  let itemId = event.context.itemId;  // "item1"
} );

rowData

Gets the data for the selected row.

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.

Syntax

get rowData(): Object
TYPE
?
The kind of data the property stores.
Object

Examples

Get the selected table row information

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

Get the full item information from the dataset

$w("#myTable").onRowSelect( (event) => {
  let rowData = event.rowData;
} );

// ...

$w("#myDataset").onCurrentIndexChanged( (event) => {
  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

Gets the index of the selected row.

Description

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

Syntax

get rowIndex(): number
TYPE
?
The kind of data the property stores.
number

Examples

Get the selected table row information

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

target

Gets the element that the event was fired on.

Note

When using the target to get the value of a text input or text box in an onKeyPress event handler, you may receive the value of the element before the key was pressed. To get the text input or text box's updated value, use the updatedTargetValue property of the event handler's event parameter.

Syntax

get target(): Element
TYPE
?
The kind of data the property stores.

MIXED IN FROM

?
Where this functionality is inherited from.
$w.Event

Examples

Get the ID of the target element

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

type

Gets the type of event that was fired.

Syntax

get type(): string
TYPE
?
The kind of data the property stores.
string

MIXED IN FROM

?
Where this functionality is inherited from.
$w.Event

Examples

Get the type of the event

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