typeahead event

typeahead-event.js

.on("typeahead:selected", function (obj, datum) {
	// what happens when a user selects\clicks a suggestion
	// we get the datum that contains the properties we defined when we setup the engine via the filter function
	map.graphics.clear();
	switch(datum.source) {
	    case "esri-geocoder":
	        var url = config.arcgisGeocodingBaseUrl + "find?" +
	            "magicKey=" + datum.magicKey + "&text=" + datum.name + 
	            "&outFields=Addr_type&f=json";
	        // https://developers.arcgis.com/rest/geocode/api-reference/geocoding-find.htm
	        // make the call to the geocode service to get the result
	        $.getJSON(url, function(result) {
	            try {
	                if(result.locations.length > 0) {
	                    var extent = result.locations[0].extent;
	                    map.setExtent(new Extent(extent), true);
	                }
	                else {
	                    $("#searchBox").val("Could not go to" + datum.name);
	                }
	            }
	            catch(e) {
	                //console.log(e);
	            }
	        });
	        break;
	    default:
	         // since our datums and geometry types are the same we can capture everything that isn't a geocode result
	        // and query the correct layer
	        // if you have various data sources they may need to be handled individually here
	        var layerIndex = null;
	        
	        switch(datum.source) {
	            case "camp":
	                layerIndex = config.featureLayerIndexes.camp;
	                break;
	            case "trail":
	                layerIndex = config.featureLayerIndexes.trail;
	                break;
	            case "ski":
	                layerIndex = config.featureLayerIndexes.ski;
	                break;
	        }
	        
	        var url = config.featureServerUrl + layerIndex + "/query?" +
	            "objectIds=" + datum.objectId +
	            "&outFields=*&returnGeometry=true&outSR=4326&f=json";
	        
	        $.getJSON(url, function(result) {
	            // create a point from the result (and give it a little scooch north) and zoom the map to it
	            var pt = new Point(result.features[0].geometry.x, result.features[0].geometry.y + .001);
	            map.centerAndZoom(pt, 14);
	            
	            // put the name in the graphics layer of the map
	            var text =  new esri.symbol.TextSymbol(datum.name)
	            .setColor(new esri.Color("#064780"))
	            .setAlign(esri.symbol.Font.ALIGN_START)
	            .setFont(new esri.symbol.Font("24px",esri.symbol.Font.STYLE_NORMAL, esri.symbol.Font.VARIANT_NORMAL,esri.symbol.Font.WEIGHT_BOLD,"Arial"));
	            var graphic = new esri.Graphic(pt, text);
	            map.graphics.add(graphic);
	        });
	        break;
	}
	});