TableListViewModel

AMD: require(["esri/widgets/TableList/TableListViewModel"], (TableListVM) => { /* code goes here */ });
ESM: import TableListVM from "@arcgis/core/widgets/TableList/TableListViewModel.js";
Class: esri/widgets/TableList/TableListViewModel
Inheritance: TableListViewModelAccessor
Since: ArcGIS Maps SDK for JavaScript 4.17

Provides the logic for the TableList widget.

See also
Example
const tableList = new TableList({
  viewModel: { // autocasts as new TableListViewModel
    map: map // specify the map containing the tables
  }
});

Constructors

TableListViewModel

Constructor
new TableListViewModel(properties)
Parameter
properties Object
optional

See the properties for a list of all the properties that may be passed into the constructor.

Property Overview

Any properties can be set, retrieved or listened to. See the Watch for changes topic.
Show inherited properties Hide inherited properties
Name Type Summary Class

Whether to provide an indication if a layer is being published in the TableList.

TableListViewModel

The name of the class.

Accessor

Specifies a function that accesses each ListItem.

TableListViewModel

Specifies whether to ignore the listMode property of the layers to display all tables.

TableListViewModel

A reference to the map containing the tables.

TableListViewModel

The view model's state.

TableListViewModel

The collection of table ListItems displayed within the widget.

TableListViewModel

A collection of layer instances that are tables.

TableListViewModel

The total number of tableItems in the list.

TableListViewModel

Property Details

checkPublishStatusEnabled

Property
checkPublishStatusEnabled Boolean
Since: ArcGIS Maps SDK for JavaScript 4.25

Whether to provide an indication if a layer is being published in the TableList. When a layer is publishing, a rotating square will appear to the right of the list item title. The list item publishing property will be false if checkPublishStatusEnabled is false.

Default Value:false

declaredClass

Inherited
Property
declaredClass Stringreadonly
Inherited from Accessor

The name of the class. The declared class name is formatted as esri.folder.className.

listItemCreatedFunction

Property
listItemCreatedFunction ListItemCreatedHandler |null |undefined

Specifies a function that accesses each ListItem. Each list item can be modified according to its modifiable properties. Actions can be added to list items using the actionsSections property of the ListItem.

listModeDisabled

Property
listModeDisabled Boolean
Since: ArcGIS Maps SDK for JavaScript 4.30

Specifies whether to ignore the listMode property of the layers to display all tables. A common use case for listModeDisabled is when you want to use the TableList to manage and configure a tables's listMode value.

Default Value:false
See also

map

Property
map Map |WebMap |null |undefined

A reference to the map containing the tables. Set this property to access the underlying tables within the map.

Example
// FeatureLayer.isTable = true.
Layer.fromPortalItem({
  // Loads a layer (table) from a portal item
  portalItem: { // autocasts new PortalItem()
    id: "add portal id item"
  }
}).then(function(layer) {
  // Load the layer
  layer.load().then(function() {
    // Check if the layer is a table
    if (layer.isTable) {
      map.tables.add(layer);
      console.log(map.tables);
    }
  });
});

 const tableList = new TableList({
   map: map // map contains tables collection
 });

state

Property
state Stringreadonly

The view model's state.

Possible Values:"loading" |"ready" |"disabled"

Default Value:"disabled"

tableItems

Property
tableItems Collection<ListItem>readonly

The collection of table ListItems displayed within the widget.

tables

Property
tables Collection<(Layer|Sublayer)> |null |undefined
Since: ArcGIS Maps SDK for JavaScript 4.32

A collection of layer instances that are tables.

Example
const tableList = new TableListViewModel({
  tables: tables
});

totalItems

Property
totalItems Numberreadonly
Since: ArcGIS Maps SDK for JavaScript 4.32

The total number of tableItems in the list.

See also

Method Overview

Show inherited methods Hide inherited methods
Name Return Type Summary Class

Adds one or more handles which are to be tied to the lifecycle of the object.

Accessor

Emits an event on the instance.

TableListViewModel

Indicates whether there is an event listener on the instance that matches the provided event name.

TableListViewModel

Returns true if a named group of handles exist.

Accessor

Registers an event handler on the instance.

TableListViewModel

Removes a group of handles owned by the object.

Accessor

Triggers the trigger-action event and executes the given action or action toggle.

TableListViewModel

Method Details

addHandles

Inherited
Method
addHandles(handleOrHandles, groupKey)
Inherited from Accessor
Since: ArcGIS Maps SDK for JavaScript 4.25

Adds one or more handles which are to be tied to the lifecycle of the object. The handles will be removed when the object is destroyed.

// Manually manage handles
const handle = reactiveUtils.when(
  () => !view.updating,
  () => {
    wkidSelect.disabled = false;
  },
  { once: true }
);

this.addHandles(handle);

// Destroy the object
this.destroy();
Parameters
handleOrHandles WatchHandle|WatchHandle[]

Handles marked for removal once the object is destroyed.

groupKey *
optional

Key identifying the group to which the handles should be added. All the handles in the group can later be removed with Accessor.removeHandles(). If no key is provided the handles are added to a default group.

emit

Method
emit(type, event){Boolean}

Emits an event on the instance. This method should only be used when creating subclasses of this class.

Parameters
type String

The name of the event.

event Object
optional

The event payload.

Returns
Type Description
Boolean true if a listener was notified

hasEventListener

Method
hasEventListener(type){Boolean}

Indicates whether there is an event listener on the instance that matches the provided event name.

Parameter
type String

The name of the event.

Returns
Type Description
Boolean Returns true if the class supports the input event.

hasHandles

Inherited
Method
hasHandles(groupKey){Boolean}
Inherited from Accessor
Since: ArcGIS Maps SDK for JavaScript 4.25

Returns true if a named group of handles exist.

Parameter
groupKey *
optional

A group key.

Returns
Type Description
Boolean Returns true if a named group of handles exist.
Example
// Remove a named group of handles if they exist.
if (obj.hasHandles("watch-view-updates")) {
  obj.removeHandles("watch-view-updates");
}

on

Method
on(type, listener){Object}

Registers an event handler on the instance. Call this method to hook an event with a listener.

Parameters

An event or an array of events to listen for.

listener Function

The function to call when the event fires.

Returns
Type Description
Object Returns an event handler with a remove() method that should be called to stop listening for the event(s).
Property Type Description
remove Function When called, removes the listener from the event.
Example
view.on("click", function(event){
  // event is the event handle returned after the event fires.
  console.log(event.mapPoint);
});

removeHandles

Inherited
Method
removeHandles(groupKey)
Inherited from Accessor
Since: ArcGIS Maps SDK for JavaScript 4.25

Removes a group of handles owned by the object.

Parameter
groupKey *
optional

A group key or an array or collection of group keys to remove.

Example
obj.removeHandles(); // removes handles from default group

obj.removeHandles("handle-group");
obj.removeHandles("other-handle-group");

triggerAction

Method
triggerAction(action, item)

Triggers the trigger-action event and executes the given action or action toggle.

Parameters

The action to execute.

item ListItem

An item associated with the action.

Type Definitions

ListItemCreatedHandler

Type Definition
ListItemCreatedHandler(event)

Function definition for the listItemCreatedFunction property.

Parameters
event Object

An object containing a list item created by the TableList.

Specification
item ListItem

A list item created by the TableListViewModel. You can modify the properties of this item to customize the text, actions, and visibility of the list item. See the documentation for the listItemCreatedFunction for more details.

Event Overview

Name Type Summary Class
{action: ActionButton|ActionToggle,item: ListItem}

Fires after the user clicks on an action or action toggle inside the TableList widget.

TableListViewModel

Event Details

trigger-action

Event
trigger-action

Fires after the user clicks on an action or action toggle inside the TableList widget. This event may be used to define a custom function to execute when particular actions are clicked.

Properties

The action clicked by the user.

item ListItem

An item associated with the action.

Example
tableList.viewModel.on("trigger-action", function (event) {
  let item = event.item;
  // Capture the action id.
  let id = event.action.id;

  if (id === "information") {
    window.open(item.layer.url);
  }
});

Your browser is no longer supported. Please upgrade your browser for the best experience. See our browser deprecation post for more details.

You can no longer sign into this site. Go to your ArcGIS portal or the ArcGIS Location Platform dashboard to perform management tasks.

Your ArcGIS portal

Create, manage, and access API keys and OAuth 2.0 developer credentials, hosted layers, and data services.

Your ArcGIS Location Platform dashboard

Manage billing, monitor service usage, and access additional resources.

Learn more about these changes in the What's new in Esri Developers June 2024 blog post.

Close