Create, view and delete attachments using the Attachment Editor widget. In the code sample below an attachment editor is created and set to display in the map's info window.Clicking on a feature in the map displays an info window that includes the attachment editor.
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"> <title>SanFrancisco311 - Incidents</title> <link rel="stylesheet" href="https://js.arcgis.com/3.46/esri/css/esri.css"> <style> html, body { height: 100%; width: 100%; margin: 0; overflow: hidden; } #map { height: 100%; padding: 0;} #footer { height: 2em; text-align: center; font-size: 1.1em; padding: 0.5em; } .dj_ie .infowindow .window .top .right .user .content { position: relative; } .dj_ie .simpleInfoWindow .content {position: relative;} </style> <script src="https://js.arcgis.com/3.46/"></script> <script> var map; require([ "esri/map", "esri/layers/FeatureLayer", "esri/dijit/editing/AttachmentEditor", "dojo/parser", "dojo/dom", "dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/domReady!" ], function( Map, FeatureLayer, AttachmentEditor, parser, dom ) { parser.parse(); map = new Map("map", { basemap: "gray-vector", center: [-95, 40], zoom: 3 }); map.on("load", mapLoaded); function mapLoaded() { var featureLayer = new FeatureLayer("https://services.arcgis.com/V6ZHFr6zdgNZuVG0/arcgis/rest/services/Prominent_Peaks_attach/FeatureServer/0",{ mode: FeatureLayer.MODE_ONDEMAND }); map.infoWindow.setContent("<div id='content' style='width:100%'></div>"); map.infoWindow.resize(350,200); var attachmentEditor = new AttachmentEditor({}, dom.byId("content")); attachmentEditor.startup(); featureLayer.on("click", function(evt) { var objectId = evt.graphic.attributes[featureLayer.objectIdField]; map.infoWindow.setTitle(objectId); attachmentEditor.showAttachments(evt.graphic,featureLayer); map.infoWindow.show(evt.screenPoint, map.getInfoWindowAnchor(evt.screenPoint)); }); map.addLayer(featureLayer); } }); </script> </head> <body> <div data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline'" style="width:100%;height:100%;"> <div id="map" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'"></div> <div id="footer" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'bottom'"> Click point to view/create/delete attachments. </div> </div> </body> </html>