TableList widget

This sample demonstrates how to edit using the TableList widget. In this example, two FeatureLayer tables are displayed in this widget. One table is saved within a WebMap, while the other is added dynamically in the app by calling the fromPortalItem method and passing in the itemId of the associated hosted table.

The widget takes a map property which contains a collection of tables. The tables are read as a collection of layers. In order for the widget to recognize if a table is valid, the feature layer's isTable property must return true.

If a table is loaded dynamically, it must first be loaded and added to the map's tables collection. The following snippet shows how this is handled.

1
2
3
4
5
6
7
8
9
10
11
12
13
Layer.fromPortalItem({
  portalItem: {
    // autocasts new PortalItem()
    id: "6aa49be79248400ebd28f1d0c6af3f9f" // loads a feature layer table from AGO portal item
  }
}).then(function(layer) {
  layer.load().then(function() {
    // Must first load the layer and then check if it's a table
    if (layer.isTable) {
      webmap.tables.add(layer); // add this table to the map's tables collection
    }
  });
});

When instantiating the widget, pass in a valid Map. In this case, we are setting it to a WebMap containing a feature layer table.

1
2
3
4
5
6
7
const tableList = new TableList({
  // Two tables should display, the first one is stored within the webmap,
  //ie. Chicago public health statistics. The other is dynamically loaded
  //from the portal item, ie. Chicago Covid daily cases deaths and hospitalizations.
  map: webmap, // get access to the map which has the collection of tables
  listItemCreatedFunction: createActions // call createActions function to set ActionToggle and ActionButton
});

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

The developer dashboard has moved

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