Skip to content
import FieldColumn from "@arcgis/core/widgets/FeatureTable/FieldColumn.js";
Inheritance:
FieldColumnEditorColumnColumnAccessor
Since
ArcGIS Maps SDK for JavaScript 4.16

The FieldColumn class works with the FeatureTable and provides the underlying logic for column behavior.

This class should be used for observing potential changes. Any configuration and changes to the field columns should be done handled via the TableTemplate and the FieldColumnTemplate class.

See also

Constructors

Constructor

Constructor
Parameters
ParameterTypeDescriptionRequired
properties
See the properties table for a list of all the properties that may be passed into the constructor.

Properties

Any properties can be set, retrieved or listened to. See the Watch for changes topic.
PropertyTypeClass
alias
readonly
autoWidth
inherited
declaredClass
readonly inherited
defaultValue
readonly
description
inherited
direction
inherited
editInfo
readonly inherited
editing
readonly inherited
effectiveLabel
readonly inherited
fieldName
readonly inherited
flexGrow
inherited
formatFunction
readonly
frozen
readonly inherited
frozenToEnd
readonly inherited
hidden
inherited
icon
inherited
Icon["icon"] | null | undefined
iconText
inherited
initialSortPriority
readonly inherited
invalid
inherited
label
inherited
labelTooltipText
inherited
maxLength
readonly
menu
readonly inherited
menuConfig
readonly inherited
menuIsOpen
readonly inherited
menuIsVisible
readonly inherited
minLength
readonly
name
deprecated readonly
nullable
readonly
resizable
readonly inherited
tableTimeZone
readonly inherited
textAlign
inherited
textWrap
inherited
timeZone
inherited
visibleElements
inherited
width
inherited

alias

readonly Property
Type
string | null | undefined

The display name for the field.

autoWidth

inherited Property
Type
boolean
Inherited from: Column

Indicates if the column width will automatically adjust to account for large content. The column ignores the current width property when autoWidth is true.

Default value
false

declaredClass

readonlyinherited Property
Type
string
Inherited from: Accessor

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

defaultValue

readonly Property
Type
number | string | null | undefined

The default value set for the field.

description

inherited Property
Type
string | null | undefined
Inherited from: Column

Contains information describing the purpose of each column.

direction

inherited Property
Type
Direction
Inherited from: Column

Controls the sort order of the column. This property will only be honored on one column in the FeatureTable widget. If direction is specified on more than one column in the same FeatureTable, it will only be honored on the column with the highest index.

This is used in combination with the initialSortPriority and FeatureTable.multiSortEnabled properties to set sorting functionality for multiple columns.

Possible ValueDescription
ascSorts the column in ascending order.
descSorts the column in descending order.
nullNo sort is applied to the column.
See also

editable

Property
Type
boolean

Indicates whether the field is editable. Editing permissions can be broken down with the following levels of priority:

  1. Field - This is derived from the FeatureLayer or SceneLayer. It takes what is set in the Field.editable property. This must always be true for editing to be enabled. This can be overridden using a field column template.
  2. Template - The editable permissions on a field can be configured by setting the FieldColumnTemplate.editable property of the FieldColumnTemplate.
  3. FeatureTable - The FeatureTable.editingEnabled property must be set on the table in order for any type of editing to be enabled.

For example, if table editing is disabled in the widget, i.e. enableEditing is not set, it is still possible to enable editing for a specific column by setting the FieldColumnTemplate.editable property. Vice versa is also true, if table editing is enabled, a field template can be used to disable editing for a specific column.

Ultimately, if the service's field is not editable, it is not possible to override its permissions using one of the options above.

See also

editInfo

readonlyinherited Property
Type
any | null | undefined
Inherited from: EditorColumn
Since
ArcGIS Maps SDK for JavaScript 4.30

editing

readonlyinherited Property
Type
boolean
Inherited from: EditorColumn
Since
ArcGIS Maps SDK for JavaScript 4.30

Indicates the column is currently displaying editable inputs in one of its cells.

effectiveDescription

readonly Property
Type
string | null | undefined
Since
ArcGIS Maps SDK for JavaScript 4.31

The sanitized description, describing the purpose of each column. This takes into account the optional values of both the columns's template description and the value of the field's description. The template description takes precedence over the field's description as to allow for customizing the column's description.

See also

effectiveLabel

readonlyinherited Property
Type
string
Inherited from: Column

The sanitized label string safe for display in the header cell. Defaults to using fieldName if a label is not defined on the column.

field

autocast Property
Type
Field

The Field associated with this column.

fieldName

readonlyinherited Property
Type
string
Inherited from: Column

The unique field name as defined by the data source.

flexGrow

inherited Property
Type
number
Inherited from: Column

Controls the flex-grow property for the column. When set to 0, cell width is fixed.

Default value
1

formatFunction

readonly Property
Type
FieldValueFormatFunction | null | undefined

Custom function for rendering cell content that is called when the column is rendered in the table. The function should return the formatted content to display within a table's cell. This can be a string, number, an HTML element, or equivalent node type (e.g. a Calcite component). If the content is an HTML element, it is appended to the root element. If the content is a string or number, it is set as the innerHTML of the root element. If the content is null, the root element is cleared. If the content is undefined, the root element is not modified. This property is useful when you want to customize the cell content. For example, you can use this property to create a custom cell renderer that displays a progress bar in the cell. The progress bar can be used to show the progress of a task.

Example
// The following example demonstrates how to use the formatFunction property to create a custom cell renderer that displays a progress bar in the cell. The progress bar can be used to show the progress of a task.
column.formatFunction = ({ column, feature, index, value })=> {
const progress = document.createElement("progress");
progress.max = 100;
progress.value = value;
return progress;
};

frozen

readonlyinherited Property
Type
boolean
Inherited from: Column

Indicates if the the column is frozen in place at the beginning of the table. Column must be first in the FeatureTable's column's, or next to other frozen columns.

Default value
false

frozenToEnd

readonlyinherited Property
Type
boolean
Inherited from: Column

Indicates if the column is frozen in place at the end of the table. Column must be last in the FeatureTable's column's, or next to other columns with frozenToEnd set to true.

Default value
false

hidden

inherited Property
Type
boolean
Inherited from: Column

Indicates whether the column is visible.

Default value
false

icon

inherited Property
Type
Icon["icon"] | null | undefined
Inherited from: Column

The string value indicating the icon displayed in the header cell of the column.

See also

iconText

inherited Property
Type
string | null | undefined
Inherited from: Column
Since
ArcGIS Maps SDK for JavaScript 4.32

The string value displayed when hovering over the associated icon displayed in the header cell of the column. When a value is not provied, the column label is displayed instead. A value for 'icon' must also be set on the column.

See also

initialSortPriority

readonlyinherited Property
Type
number | null | undefined
Inherited from: Column

Indicates the initial sort priority of the column when first rendered.

invalid

autocast inherited Property
Type
boolean
Inherited from: Column

Indicates whether the column is in an invalid state.

label

inherited Property
Type
string | null | undefined
Inherited from: Column

The default label displayed in the column header cell.

labelTooltipText

inherited Property
Type
string | null | undefined
Inherited from: Column

Text displayed when hovering over the column header label. Defaults to the typical column label when a value is not provided.

layer

Property
Type
CatalogFootprintLayer | CSVLayer | FeatureLayer | GeoJSONLayer | ImageryLayer | KnowledgeGraphSublayer | SceneLayer | WFSLayer

The associated CatalogFootprintLayer, CSVLayer, FeatureLayer, GeoJSONLayer, ImageryLayer, KnowledgeGraphSublayer, SceneLayer, or WFSLayer containing the fields and attributes to display within the widget.

maxLength

readonly Property
Type
number

Restricts the input length for the column.

readonlyinherited Property
Type
HTMLElement
Inherited from: Column

The element representing the field column's menu.

readonlyinherited Property
Type
ColumnTableMenuConfig | null | undefined
Inherited from: Column

Configuration options for the column's menu.

FeatureTable.tableTemplate.

readonlyinherited Property
Type
boolean
Inherited from: Column
Since
ArcGIS Maps SDK for JavaScript 4.30

Indicates whether the column's menu is currently open.

readonlyinherited Property
Type
boolean
Inherited from: Column
Since
ArcGIS Maps SDK for JavaScript 4.30

Indicates whether the Column's menu will be displayed.

minLength

readonly Property
Type
number | null | undefined

Restricts the input length for the column.

name

deprecatedreadonly Property
Type
string | null | undefined

The name of the field.

nullable

readonly Property
Type
boolean

Indicates if the field can accept null values.

required

Property
Type
boolean

Indicates whether a value is required when editing feature attributes within the table's cell.

resizable

readonlyinherited Property
Type
boolean
Inherited from: Column

Indicates whether the column is resizable.

Default value
true

sortable

Property
Type
boolean

Indicates whether the column is sortable.

Default value
true

tableTimeZone

readonlyinherited Property
Type
TimeZone | null | undefined
Inherited from: Column
Since
ArcGIS Maps SDK for JavaScript 4.31

The FeatureTable.timeZone of the parent table widget.

template

Property
Type
FieldColumnTemplate | null | undefined
Since
ArcGIS Maps SDK for JavaScript 4.28

A configurable template for the table column. The template allows for customizing the appearance of the column. Once the template is set, it will override the default appearance and will remain as such once the table is created. Any information regarding the column's current state can be accessed using the Column class.

Templates should be used primarily for initial column configuration and should not be used for observing changes.

textAlign

inherited Property
Type
TextAlign
Inherited from: Column

Aligns the columns cell content horizontally.

Default value
"start"

textWrap

inherited Property
Type
boolean
Inherited from: Column

Indicates cell content should be wrapped and displayed on multiple lines within the cell. Warning: this causes rows to expand when tall content is visible in the viewport. Scrolling tall cells into the viewport may cause the table to visually jump depending on the height of the expanding rows.

Default value
false

view

Property
Type
MapViewOrSceneView | null | undefined

A reference to the MapView or SceneView.

visibleElements

inherited Property
Type
VisibleElements | null | undefined
Inherited from: Column

The visible elements of the column's associated FeatureTable.

width

inherited Property
Type
number | string
Inherited from: Column

Width of the column in pixels. If providing value as a string, the string must include "px" suffix. This value is only honored when there are enough columns to fill the viewport, or flexGrow has been set to 0.

Default value
200

Methods

MethodSignatureClass
closeMenu
inherited
closeMenu(): void
openMenu
inherited
openMenu(): void
sort
inherited
sort(): void

closeMenu

inherited Method
Signature
closeMenu (): void
Inherited from: Column

Convenience method for closing the column menu.

See also
Returns
void

openMenu

inherited Method
Signature
openMenu (): void
Inherited from: Column

Convenience method for opening the column menu. This has no effect if the menu is not visible or has no menu items. It follows the direction pattern of ascending, to descending, then no sort order.

See also
Returns
void

sort

inherited Method
Signature
sort (): void
Inherited from: Column

Convenience method for sorting the current column. It has no effect if the column is not sortable.

See also
Returns
void