Hide Table of Contents
esri/dijit/util
esri/layer/pixelFilters
esri/process
esri/support
esri/workers
Class: AttributeInspector

require(["esri/dijit/AttributeInspector"], function(AttributeInspector) { /* code goes here */ });

Description

(Added at v2.0)
The AttributeInspector displays the attributes of selected features from one or more feature layers. If the layer is editable, the feature attributes will be editable. The AttributeInspector widget honors the domains and subtypes as defined by the Feature Service. The widget is used by the Editor widget, but can also be used directly in both editing and "show attributes" scenarios. While commonly put into an InfoWindow, you can also put it into other containers, for example outside of the map or without using a map. If the feature layer supports attachments, attachments will be visible in the attribute inspector. If the feature layers are from a feature service then attribute inspector will include the ability to create, view and delete attachments.

Samples

Search for samples that use this class.

Constructors

NameSummary
new AttributeInspector(params, srcNodeRef)Creates a new Attribute Inspector object.

Constants

NameDescription
STRING_FIELD_OPTION_RICHTEXTField displayed as a rich text field.
STRING_FIELD_OPTION_TEXTAREAField displayed as a text area.
STRING_FIELD_OPTION_TEXTBOXField displays as a text box.

CSS

esri/dijit/AttributeInspector | Download source

NameDescription
Icons

Change the icon for the following buttons:

  • atiPrevIcon
  • atiNextIcon
  • atiFirstIcon
  • atiLastIcon
  • atiDeleteIcon
atiButtonStyle for individual buttons.
atiButtonsStyle the node that contains the buttons at the bottom of the attribute inspector.
.esriAttributeInspector .atiButtons{ color:#705B35;}
atiEditorTrackingInfoDefine the style for the editor tracking info div. Controls styles such as font, margin and padding.
atiFieldGeneral style for all the fields in the attribute inspector.
.esriAttributeInspector .atiField { background:#FFF6D9; } 
atiLabelStyle labels in the attribute inspector.
.esriAttributeInspector .atiLabel { font-weight:bold; color:#705B35; }
atiLayerNameStyle the text at the top of the attribute inspector that displays the layer name.
 .esriAttributeInspector .atiLayerName {display:none;}
atiNavButtonsStyle the first, next, back and last buttons.
atiNavMessageStyle the navigation message.
atiRichTextFieldStyle for rich text fields.
atiTextAreaFieldStyle for fields displayed at text area.
attachmentEditorStyle the node that contains the attachment editor.
esriAttributeInspectorGeneral attribute inspector style

Methods

NameReturn typeSummary
destroy()NoneDestroys the widget, used for page clean up.
first()NoneMoves to the first feature.
last()NoneMoves to the last feature.
next()NoneMove to the next feature.
previous()NoneMove to the previous feature.
refresh()NoneUpdates the contents of the AttributeInspector.
startup()NoneFinalizes the creation of the widget.

Events

[ On Style Events | Connect Style Event ]
All On Style event listeners receive a single event object. Additionally, the event object also contains a 'target' property whose value is the object which fired the event.

Events

NameEvent ObjectSummary
attribute-change
{
  feature: <Graphic>,
  fieldName: <String>,
  fieldValue: <String>
}
Fires when a fields value changes.
delete
{
  feature: <Graphic>
}
Fires when the AttributeInspector's delete button is pressed.
next
{
  feature: <Graphic>
}
Fires when the AttributeInspector's next or back button is pressed.
Constructor Details

new AttributeInspector(params, srcNodeRef)

Creates a new Attribute Inspector object.
Parameters:
<Object> params Required See options list.
<Node | String> srcNodeRef Required HTML element where the attribute inspector should be rendered.
params properties:
<Object[]> layerInfos Required See the object specifications table below for the structure of the layerInfos object.
Object Specifications:
<fieldInfo>
<dijit> customField Required Specify a custom dijit as the editor for this field.
<String> fieldName Required The name of the field to customize
<Object> format Required Opt-in to allow the editing of time on a date field. An object with a single Boolean property named "time". Added at 3.10.
{
  "fieldName": "lastreport",
  "label": "Last Report",
  "isEditable": true,
  "tooltip": "",
  "visible": true,
  "stringFieldOption": "textbox",
  "format":{
    "time": true
  }
}
<Boolean> isEditable Required Disable editing of the field. Setting this to true does not override a false value from the server. It will not allow editing directly within a PopupTemplate.
<String> richTextPlugins Required Use this option to override the default setting for the plug-in when usingthe rich text editor. See Dojo Editor documentationfor details.
<String> stringFieldOption Required Set the type of field to use when editing string values. See the constants table for a list of valid values.
<String> tooltip Required Define a tooltip for the field.
<layerInfo>
<FeatureLayer> featureLayer Required Array of feature layers. Required.
<FieldInfo[]> fieldInfos Required Customize how fields appear in the attribute inspector. If nothing is specified all fields, except the ObjectId and GlobalId are displayed. Specify fieldInfos to explicitly define the fields that are displayed and the field order. See fieldInfo for details.
<String[]> htmlFields Required Display a rich text editor for the specified fields.Deprecated at 2.2 specify StringFieldOption instead.
<Boolean> isEditable Required Disable editing of the layer's attributes. Does not override a false value from the server. It will not allow editing directly within a PopupTemplate.
<Boolean> showAttachments Required Hide or display attachments for this layer. Only valid when attachmentsare enabled for the service. Does not override a false value from the server.
<Boolean> showDeleteButton Optional Display the delete button on the attribute inspector dialog.
<Boolean> showGlobalID Optional Show the GlobalID field. Deprecated at 2.2. At version 2.2 the ObjectID and GlobalId are hidden by default. To display these specify them using fieldInfos.
<Boolean> showObjectID Optional Show the ObjectID field. Deprecated at 2.2. At version 2.2 the ObjectID and GlobalId are hidden by default. To display these specify them using fieldInfos.
<String> userId Required Provide a userId for the currently logged-in user. If the application is using the IdentityManager it is not necessary to specify a userId since the feature layer has access to the credential object which contains this information. Requires ArcGIS Server feature service version 10.1 or greater. (As of 2.6)
Method Details

destroy()

Destroys the widget, used for page clean up.

first()

Moves to the first feature.

last()

Moves to the last feature.

next()

Move to the next feature.

previous()

Move to the previous feature.

refresh()

Updates the contents of the AttributeInspector.

startup()

Finalizes the creation of the widget. (Added at v3.12)
Event Details
[ On Style Events | Connect Style Event ]

attribute-change

Fires when a fields value changes. When used outside of the Editor widget it is up to the developer to update the feature's attributes. (Added at v3.6)
Event Object Properties:
<Graphic> feature The feature to be updated.
<String> fieldName The name of the field that was modified.
<String> fieldValue Value for the field that was modified.
Sample:
require([
 ... 
], function( ... ) {
  attInspector.on("attribute-change", function(evt) {
    var feature = evt.feature;
    feature.attributes[evt.fieldName] = evt.newFieldValue;
    feature.getLayer().applyEdits(null, [feature], null);
  });
  ...
});

delete

Fires when the AttributeInspector's delete button is pressed. When used outside of the Editor widget it is up to the developer to delete the feature from the feature service. (Added at v3.6)
Event Object Properties:
<Graphic> feature Feature to be deleted.
Sample:
require([
 ... 
], function( ... ) {
   attInspector.on("delete",function(evt){
    var feature = evt.feature;
    feature.getLayer().applyEdits(null,null,[feature]);
     map.infoWindow.hide();
  });
  ...
});

next

Fires when the AttributeInspector's next or back button is pressed. Corresponds to the feature currently displayed in the AttributeInspector. (Added at v3.6)
Event Object Properties:
<Graphic> feature Current feature displayed in the attribute inspector.
Sample:
require([
 ... 
], function( ... ) {
  attInspector.on("next", function(evt) {
    var screenPoint = map.toScreen(evt.feature.geometry.getExtent().getCenter());
    map.infoWindow.show(screenPoint,map.getInfoWindowAnchor(screenPoint));
  });
  ...
});
Show Modal