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
Constants
STRING_FIELD_OPTION_RICHTEXT | Field displayed as a rich text field. |
STRING_FIELD_OPTION_TEXTAREA | Field displayed as a text area. |
STRING_FIELD_OPTION_TEXTBOX | Field displays as a text box. |
CSS
esri/dijit/AttributeInspector | Download source
Icons | Change the icon for the following buttons:
- atiPrevIcon
- atiNextIcon
- atiFirstIcon
- atiLastIcon
- atiDeleteIcon
|
atiButton | Style for individual buttons. |
atiButtons | Style the node that contains the buttons at the bottom of the attribute inspector..esriAttributeInspector .atiButtons{ color:#705B35;} |
atiEditorTrackingInfo | Define the style for the editor tracking info div. Controls styles such as font, margin and padding. |
atiField | General style for all the fields in the attribute inspector..esriAttributeInspector .atiField { background:#FFF6D9; } |
atiLabel | Style labels in the attribute inspector..esriAttributeInspector .atiLabel { font-weight:bold; color:#705B35; } |
atiLayerName | Style the text at the top of the attribute inspector that displays the layer name. .esriAttributeInspector .atiLayerName {display:none;} |
atiNavButtons | Style the first, next, back and last buttons. |
atiNavMessage | Style the navigation message. |
atiRichTextField | Style for rich text fields. |
atiTextAreaField | Style for fields displayed at text area. |
attachmentEditor | Style the node that contains the attachment editor. |
esriAttributeInspector | General attribute inspector style |
Methods
destroy() | None | Destroys the widget, used for page clean up. |
first() | None | Moves to the first feature. |
last() | None | Moves to the last feature. |
next() | None | Move to the next feature. |
previous() | None | Move to the previous feature. |
refresh() | None | Updates the contents of the AttributeInspector. |
startup() | None | Finalizes 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
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
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
Destroys the widget, used for page clean up.
Moves to the first feature.
Moves to the last feature.
Move to the next feature.
Move to the previous feature.
Updates the contents of the AttributeInspector.
Finalizes the creation of the widget. (Added at v3.12)
Event Details
[ On Style Events | Connect Style Event ]
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);
});
...
});
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();
});
...
});
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));
});
...
});
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.
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:
dojo.connect(attInspector, "onAttributeChange", function(feature,fieldName,newFieldValue) {
feature.attributes[fieldName] = newFieldValue;
feature.getLayer().applyEdits(null, [feature], null);
});
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.
Event Object Properties:
<Graphic > feature |
Feature to be deleted. |
Sample:
dojo.connect(attInspector, "onDelete",function(feature){
feature.getLayer().applyEdits(null,null,[feature]);
map.infoWindow.hide();
});
Fires when the AttributeInspector's next or back button is pressed. Corresponds to the feature currently displayed in the AttributeInspector
Event Object Properties:
<Graphic > feature |
Current feature displayed in the attribute inspector. |
Sample:
dojo.connect(attInspector, "onNext", function(feature) {
var screenPoint = map.toScreen(feature.geometry.getExtent().getCenter());
map.infoWindow.show(screenPoint,map.getInfoWindowAnchor(screenPoint));
});