You could create a feature collection based feature layer and use that with the AttributeInspector widget. Here's an example: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=7, IE=9" /> <!--The viewport meta tag is used to improve the presentation and behavior of the samples on iOS devices--> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/> <title>Validate Attributes</title> <!-- include dojo theme --> <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.1/js/dojo/dijit/themes/claro/claro.css"> <style type="text/css"> .dj_ie .infowindow .window .top .right .user .content { position: relative; } .dj_ie .simpleInfoWindow .content {position: relative;} </style> <style> html, body { height: 100%; width: 100%; margin: 0; padding: 0; overflow:hidden; } #leftPane{ overflow:hidden; border:none; color:#5C832F; } #map{ border: solid medium #382513; padding:0; } .esriAttributeInspector{ atiLayerName:'Building Details' } .templatePicker{ border:none !important; } .templatePicker .grid .groupLabel{ display:none; } </style> <!-- specify dojo configuration to parse dijits at load time --> <script type="text/javascript"> dojoConfig = { parseOnLoad:true }; </script> <!-- reference ArcGIS JavaScript API --> <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.1"></script> <script type="text/javascript"> //require selection dijit dojo.require("esri.map"); dojo.require("esri.dijit.editing.Editor-all"); dojo.require("dijit.layout.ContentPane"); dojo.require("dijit.layout.BorderContainer"); dojo.require("dijit.form.ValidationTextBox"); var map; function init() { var initialExtent = new esri.geometry.Extent({"xmin":-13062820,"ymin":4063755,"xmax":-13048794,"ymax":4071609,"spatialReference":{"wkid":102100}}); map = new esri.Map("map", { extent:initialExtent, slider: false, nav: true }); dojo.connect(map, "onLoad", function() { //resize the map when the browser resizes dojo.connect(dijit.byId('map'), 'resize', map,map.resize); }); dojo.connect(map, "onLayersAddResult", initEditor); var basemap = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer"); map.addLayer(basemap); var featureCollection = {}; featureCollection.layerDefinition = {"id":0,"name":"Notes","type":"Feature Layer","displayField":"name","description":"","copyrightText":"","relationships":[],"geometryType":"esriGeometryPoint","minScale":0,"maxScale":0,"extent":{"xmin":-165.874652126,"ymin":-49.9999999999999,"xmax":176.176078869,"ymax":76.745946916,"spatialReference":{"wkid":4326}},"drawingInfo":{"renderer":{"type":"simple","symbol":{"type":"esriPMS","url":"images/flickr.png","contentType":"image/png","color":null,"width":28,"height":28,"angle":0,"xoffset":0,"yoffset":0},"label":"","description":""},"transparency":0,"labelingInfo":null},"hasAttachments":true,"htmlPopupType":"esriServerHTMLPopupTypeAsHTMLText","objectIdField":"objectid","globalIdField":"globalid","typeIdField":"","fields":[{"name":"objectid","type":"esriFieldTypeOID","alias":"Objectid","editable":false,"domain":null},{"name":"note","type":"esriFieldTypeString","alias":"Note","editable":true,"length":255,"domain":null},{"name":"link","type":"esriFieldTypeString","alias":"Link","editable":true,"length":2048,"domain":null},{"name":"name","type":"esriFieldTypeString","alias":"Name","editable":true,"length":50,"domain":null},{"name":"email","type":"esriFieldTypeString","alias":"Email","editable":true,"length":50,"domain":null},{"name":"phone","type":"esriFieldTypeString","alias":"Phone","editable":true,"length":50,"domain":null},{"name":"globalid","type":"esriFieldTypeGlobalID","alias":"globalid","editable":false,"length":38,"domain":null},{"name":"notedate","type":"esriFieldTypeDate","alias":"Notedate","editable":false,"length":36,"domain":null}],"types":[],"templates":[{"name":"Notes","description":"","drawingTool":"esriFeatureEditToolPoint","prototype":{"attributes":{"notedate":null,"note":null,"link":null,"name":null,"email":null,"phone":null}}}],"capabilities":"Query,Editing"} var fields = dojo.map(featureCollection.layerDefinition.fields, function(field) { return field.name; }); var featureLayer = new esri.layers.FeatureLayer(featureCollection, { outFields: fields }); map.addLayers([featureLayer]); } function initEditor(results) { //only one layer var featureLayer = results[0].layer; var templatePicker = new esri.dijit.editing.TemplatePicker({ featureLayers: [featureLayer], rows: 'auto', groupingEnabled:false, columns: 1 },'editorDiv'); templatePicker.startup(); var layerInfos = [{ 'featureLayer':featureLayer, 'showAttachments':false, 'showDeleteButton':false, 'fieldInfos':[ {'fieldName':'name','label':'Name'}, {'fieldName':'email','label':'Email'}, {'fieldName':'phone','label':'Phone'}, {'fieldName':'note','label':'Details', 'stringFieldOption':esri.dijit.AttributeInspector.STRING_FIELD_OPTION_TEXTAREA}, {'fieldName':'notedate','label':'Date'} ] }]; //define the editor settings var settings = { map: map, templatePicker:templatePicker, layerInfos:layerInfos }; var params = {settings: settings}; //Create the editor widget var editorWidget = new esri.dijit.editing.Editor(params); editorWidget.startup(); //resize the info window (attribute inspector) map.infoWindow.resize(295,245); } dojo.addOnLoad(init); </script> </head> <body class="claro"> <div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="design:'sidebar'" style="width:100%;height:100%;"> <div id="map" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'center'"></div> <div id="leftPane" data-dojo-type="dijit.layout.ContentPane" style="width:100px;" data-dojo-props="region:'left'"> <div id="editorDiv"></div> <div></div> </div> </div> </body> </html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=7, IE=9" /> <!--The viewport meta tag is used to improve the presentation and behavior of the samples on iOS devices--> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/> <title>Validate Attributes</title> <!-- include dojo theme --> <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.1/js/dojo/dijit/themes/claro/claro.css"> <style type="text/css"> .dj_ie .infowindow .window .top .right .user .content { position: relative; } .dj_ie .simpleInfoWindow .content {position: relative;} </style> <style> html, body { height: 100%; width: 100%; margin: 0; padding: 0; overflow:hidden; } #leftPane{ overflow:hidden; border:none; color:#5C832F; } #map{ border: solid medium #382513; padding:0; } .esriAttributeInspector{ atiLayerName:'Building Details' } .templatePicker{ border:none !important; } .templatePicker .grid .groupLabel{ display:none; } </style> <!-- specify dojo configuration to parse dijits at load time --> <script type="text/javascript"> dojoConfig = { parseOnLoad:true }; </script> <!-- reference ArcGIS JavaScript API --> <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.1"></script> <script type="text/javascript"> //require selection dijit dojo.require("esri.map"); dojo.require("esri.dijit.editing.Editor-all"); dojo.require("dijit.layout.ContentPane"); dojo.require("dijit.layout.BorderContainer"); dojo.require("dijit.form.ValidationTextBox"); var map; function init() { var initialExtent = new esri.geometry.Extent({"xmin":-13062820,"ymin":4063755,"xmax":-13048794,"ymax":4071609,"spatialReference":{"wkid":102100}}); map = new esri.Map("map", { extent:initialExtent, slider: false, nav: true }); dojo.connect(map, "onLoad", function() { //resize the map when the browser resizes dojo.connect(dijit.byId('map'), 'resize', map,map.resize); }); dojo.connect(map, "onLayersAddResult", initEditor); var basemap = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer"); map.addLayer(basemap); var featureCollection = {}; featureCollection.layerDefinition = {"id":0,"name":"Notes","type":"Feature Layer","displayField":"name","description":"","copyrightText":"","relationships":[],"geometryType":"esriGeometryPoint","minScale":0,"maxScale":0,"extent":{"xmin":-165.874652126,"ymin":-49.9999999999999,"xmax":176.176078869,"ymax":76.745946916,"spatialReference":{"wkid":4326}},"drawingInfo":{"renderer":{"type":"simple","symbol":{"type":"esriPMS","url":"images/flickr.png","contentType":"image/png","color":null,"width":28,"height":28,"angle":0,"xoffset":0,"yoffset":0},"label":"","description":""},"transparency":0,"labelingInfo":null},"hasAttachments":true,"htmlPopupType":"esriServerHTMLPopupTypeAsHTMLText","objectIdField":"objectid","globalIdField":"globalid","typeIdField":"","fields":[{"name":"objectid","type":"esriFieldTypeOID","alias":"Objectid","editable":false,"domain":null},{"name":"note","type":"esriFieldTypeString","alias":"Note","editable":true,"length":255,"domain":null},{"name":"link","type":"esriFieldTypeString","alias":"Link","editable":true,"length":2048,"domain":null},{"name":"name","type":"esriFieldTypeString","alias":"Name","editable":true,"length":50,"domain":null},{"name":"email","type":"esriFieldTypeString","alias":"Email","editable":true,"length":50,"domain":null},{"name":"phone","type":"esriFieldTypeString","alias":"Phone","editable":true,"length":50,"domain":null},{"name":"globalid","type":"esriFieldTypeGlobalID","alias":"globalid","editable":false,"length":38,"domain":null},{"name":"notedate","type":"esriFieldTypeDate","alias":"Notedate","editable":false,"length":36,"domain":null}],"types":[],"templates":[{"name":"Notes","description":"","drawingTool":"esriFeatureEditToolPoint","prototype":{"attributes":{"notedate":null,"note":null,"link":null,"name":null,"email":null,"phone":null}}}],"capabilities":"Query,Editing"} var fields = dojo.map(featureCollection.layerDefinition.fields, function(field) { return field.name; }); var featureLayer = new esri.layers.FeatureLayer(featureCollection, { outFields: fields }); map.addLayers([featureLayer]); } function initEditor(results) { //only one layer var featureLayer = results[0].layer; var templatePicker = new esri.dijit.editing.TemplatePicker({ featureLayers: [featureLayer], rows: 'auto', groupingEnabled:false, columns: 1 },'editorDiv'); templatePicker.startup(); var layerInfos = [{ 'featureLayer':featureLayer, 'showAttachments':false, 'showDeleteButton':false, 'fieldInfos':[ {'fieldName':'name','label':'Name'}, {'fieldName':'email','label':'Email'}, {'fieldName':'phone','label':'Phone'}, {'fieldName':'note','label':'Details', 'stringFieldOption':esri.dijit.AttributeInspector.STRING_FIELD_OPTION_TEXTAREA}, {'fieldName':'notedate','label':'Date'} ] }]; //define the editor settings var settings = { map: map, templatePicker:templatePicker, layerInfos:layerInfos }; var params = {settings: settings}; //Create the editor widget var editorWidget = new esri.dijit.editing.Editor(params); editorWidget.startup(); //resize the info window (attribute inspector) map.infoWindow.resize(295,245); } dojo.addOnLoad(init); </script> </head> <body class="claro"> <div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="design:'sidebar'" style="width:100%;height:100%;"> <div id="map" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'center'"></div> <div id="leftPane" data-dojo-type="dijit.layout.ContentPane" style="width:100px;" data-dojo-props="region:'left'"> <div id="editorDiv"></div> <div></div> </div> </div> </body> </html>
Angemeldete Mitglieder können Beiträge verfassen, Updates folgen und mehr. Neu hier? Registriere ein kostenloses Konto.
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.