I tried your suggestion and placing map.addLayers at the end of my callback just caused the runtime to skip over most of the callback before adding the layers...I reproduced my problem using esri data (apologies for the extra indents), placing log statements throughout to monitor the timing of my code. It should work so:After loading my map and layers in init, I call a query function that obtains all the results for the req_type field, and then fires a callback that loops through the results and places the unique values into an object store. This store is used to populate a drop down that appears in the attribute inspector. So its basically a plain editing app that has a custom drop down for one of its attribute inspector fieldsMy problem is that the initEditor function that sets up the attribute inspector starts as soon as my map layers are added, and completes before my callback has the chance to complete. When I place an alert though, it halts initEditor, allowing the populateList callback to complete. I am just wondering if I can make the populateList a deferred that when resolved adds my map layers which in turn starts my editor initialization...
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=7, IE=9, IE=10">
<!--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>Add New Needs</title>
<link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/js/dojo/dijit/themes/claro/claro.css">
<link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/js/esri/css/esri.css" />
<link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/js/dojo/dojox/grid/resources/Grid.css">
<link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/js/dojo/dojox/grid/resources/claroGrid.css">
<style>
html,body{height:100%;width:100%;margin:0;overflow:hidden;}
#map{
padding:0;
}
.dj_ie .infowindow .window .top .right .user .content { position: relative; }
.dj_ie .simpleInfoWindow .content {position: relative;}
</style>
<script>var dojoConfig = { parseOnLoad:true };</script>
<script src="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/"></script>
<script>
dojo.require("dijit.dijit"); // optimize: load dijit layer
dojo.require("dijit.layout.BorderContainer");
dojo.require("dijit.layout.ContentPane");
dojo.require("esri.dijit.Geocoder");
dojo.require("dijit.layout.StackContainer");
dojo.require("dijit.MenuBar");
dojo.require("dijit.PopupMenuBarItem");
dojo.require("dijit.DropDownMenu");
dojo.require("dijit.MenuItem");
dojo.require("esri.layers.FeatureLayer");
dojo.require("dojo.parser");
dojo.require("dijit.form.ComboBox");
dojo.require("esri.dijit.editing.Editor-all");
dojo.require("esri.SnappingManager");
dojo.require("esri.dijit.editing.AttachmentEditor");
dojo.require("dijit.form.Select");
dojo.require("dijit.form.ComboBox");
dojo.require("dojo.store.Memory");
dojo.require("dojo.Deferred");
var map;
function init() {
console.log("drop line 1");
esriConfig.defaults.io.proxyUrl = "/proxy";
//This service is for development and testing purposes only. We recommend that you create your own geometry service for use within your applications.
esri.config.defaults.geometryService = new esri.tasks.GeometryService("http://tasks.arcgisonline.com/ArcGIS/rest/services/Geometry/GeometryServer");
var customExtentAndSR = new esri.geometry.Extent({"xmin": -134.060026464775,"ymin": 32.885241223675,"xmax": -110.305411069225,"ymax": 42.2934163323251,"spatialReference": {"wkid": 4326}});
map = new esri.Map("map", {extent:customExtentAndSR, zoom: 11});
dojo.connect(map, "onLayersAddResult", initEditor);
var basemap = new esri.layers.ArcGISTiledMapServiceLayer("http://services.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer");
var needPoints = new esri.layers.FeatureLayer("http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/SanFrancisco/311Incidents/FeatureServer/0");
map.addLayers([basemap, needPoints]);
var queryTaskDocs = new esri.tasks.QueryTask("http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/SanFrancisco/311Incidents/MapServer/0");
var queryDocs = new esri.tasks.Query();
queryDocs.outFields = ["req_type"];
queryDocs.returnGeometry = false;
queryDocs.where = "req_type <> ''"
queryTaskDocs.execute(queryDocs,populateListDocs);
console.log("drop line 3");
}
function populateListDocs(results) {
console.log("drop line 4");
//Populate the dropdown list box with unique values
var type;
var values = [];
var testVals={};
var features = results.features;
dojo.forEach (features, function(feature) {
type = feature.attributes.req_type;
if (!testVals[type]) {
testVals[type] = true;
values.push({name:type});
}
});
store1 = new dojo.store.Memory({data:values});
dijit.byId("docSelect").set("store", store1);
def.resolve();
console.log("store is set");
};
function initEditor(results) {
alert("this is just here for now");
console.log("drop line 5");
var templateLayers = dojo.map(results,function(result){
return result.layer;
});
console.log("drop line 6");
var templatePicker = new esri.dijit.editing.TemplatePicker({
featureLayers: templateLayers,
grouping: false,
rows: 'auto',
columns: 3
},'templateDiv');
templatePicker.startup();
//widget used for the attribute inspector custom field
var docSelect = new dijit.form.ComboBox({
id: "docSelect",
name: "docSelect",
store: store1,
}, "docSelect");
var layers = arrayUtils.map(evt.layers, function(result) {
return { featureLayer: result.layer,
showDeleteButton:true,
fieldInfos:[
{fieldName: "req_id", visible: true, 'label':"id", 'customField': docSelect},
{fieldName: "req_type", visible: true, 'label':"req type", 'customField': docSelect}
]
};
});
var settings = {
map: map,
templatePicker: templatePicker,
layerInfos:layers,
toolbarVisible: true,
createOptions: {
polylineDrawTools:[ esri.dijit.editing.Editor.CREATE_TOOL_FREEHAND_POLYLINE],
polygonDrawTools: [ esri.dijit.editing.Editor.CREATE_TOOL_FREEHAND_POLYGON,
esri.dijit.editing.Editor.CREATE_TOOL_CIRCLE,
esri.dijit.editing.Editor.CREATE_TOOL_TRIANGLE,
esri.dijit.editing.Editor.CREATE_TOOL_RECTANGLE
]
},
toolbarOptions: {
reshapeVisible: true
}
};
console.log("drop line 8");
var params = {settings: settings};
//Create the editor widget
var myEditor = new esri.dijit.editing.Editor(params,'editorDiv');
//define snapping options
var symbol = new esri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_CROSS, 15, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([255, 0, 0, 0.5]), 5), null);
map.enableSnapping({
snapPointSymbol:symbol,
tolerance:20,
snapKey:dojo.keys.ALT
});
myEditor.startup();
}
console.log("drop line 9");
dojo.ready(init);
</script>
</head>
<body class="claro">
<div id="main" data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline'" style="height:width:100%;height:100%;">
<div data-dojo-type="dijit/layout/ContentPane" id="header" data-dojo-props="region:'top'">
Edit Hydrography
</div>
<div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'left'" style="width: 300px;overflow:hidden;">
<div id="templateDiv"></div>
<div id="editorDiv"></div>
</div>
<div data-dojo-type="dijit/layout/ContentPane" id="map" data-dojo-props="region:'center'"></div>
</div>
</body>
</html>
