dojo.deferred not returning correctly per Esri sample example

[Jay_Gregory]

I am following the instructions here:

My function:

function getContent(graphic) {
        var deferred = new dojo.Deferred();
        facID = graphic.attributes.FacilityID;
        console.log(facID);
        deferred = esri.request({
        url: "http://myserver.com/arcgis/rest/services/EON/Assets/MapServer/0/query",
        content:{
              where: "LocationID = '" + facID + "'",
              outFields: "*",
              f: "json"
           },
        callbackParamName: "callback",
        load: function(fset) {
           console.log(fset);
           deferred.callback("blahhh");
        },
        error: function(error) {
           deferred.errback("Error occurred while generating profile");
        }
        });
       return deferred;
  
      }

generates an error at the "return deferred" line.  The error is "Uncaught NotFoundError: An attempt was made to reference a Node in a context where it does not exist."

What do I need to do to make this work?

[TracySchloss]

To me, the whole point of the example is that the infowindow contains a very complex graphic and you have to wait for it to generate before you can use it.  In your example it looks like you're just executing a simple queryTask.  I think you should be working from a queryTask example instead.

[ReneRubalcava]

When you do

var deferred = new dojo.Deferred();

you need to return the promise.

return deferred.promise;

For reference
http://dojotoolkit.org/reference-guide/1.9/dojo/Deferred.html

esri.request already returns a promise, so don't use deferred = new dojo.Deferred();
Just do

var deferred = esri.request();

https://developers.arcgis.com/en/javascript/jsapi/namespace_esri-amd.html#request

[Jay_Gregory]

Basically I'm trying to populate some info window content with the attributes from another feature service.  I wasn't able to get it working use either of those suggestions.  Any others I might try?

Tracy: This code doesn't seem to work as intended either:

function getContent(graphic) {
       var facID = graphic.attributes.FacilityID;
       console.log(facID);
        var queryTask = new esri.tasks.QueryTask("http://myserver:6080/arcgis/rest/services/EON/Assets/MapServer/0");
        var query = new esri.tasks.Query();
        query.where = "LocationID = '" + facID + "'"
        query.outFields = ['*'];
        queryTask.execute(query,success,failure);
      }
      function success(data){
        var attributes = data.features[0].attributes;
        var name = attributes.FullName;
        var flDaily = attributes.FlDaily;
        var artcc = attributes.BoundaryATRCCComputerID;
        var url = attributes.URL2;
        var type = attributes.UseType;

        var content = name + "<ul><li><b>Daily Flight: </b>" + flDaily.toString() + "</li><li><b>ARTCC: </b>" + artcc + "</li><li><b>Type: </b>" + type + "</li></ul><a href = '" + url + "'>More Info </a>"
        template.setContent(content);
      }
      function failure(error){
        console.log(error);
      }
}

The first info window doesn't display anything, and each subsequent info window displays what the first info window should have.
I'm calling it like this:

 template = new esri.InfoTemplate();
        template.setTitle("Code: ${FacilityID}");
        template.setContent(getContent);

 

Rene, unfortunately your suggestion didn't seem to fix the problem.

function getContent(graphic) {
facID = graphic.attributes.FacilityID;console.log(facID);
        var deferred = esri.request({
        url: "http://myserver:6080/arcgis/rest/services/EON/Assets/MapServer/0/query",
        content:{
              where: "LocationID = '" + facID + "'",
              outFields: "*",
              f: "json"
           },
        callbackParamName: "callback",
        handleAs: "json"});
        
        deferred.then(
           function(response) {
            console.log("Success: ", response);
            deferred.callback("testing");
  }, function(error) {
      console.log("Error: ", error);
  });
        return deferred.promise;
}

The deferred.then section works, but trying to return deferred.promise still generates an error.

Any other thoughts?

[ReneRubalcava]

There's a slight typo in that original code sample.
new esri.esri.dijit.InfoWindow
should be
new esri.dijit.InfoWindow
This works.

<!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></title>

    <link rel="stylesheet" href="http://js.arcgis.com/3.7/js/dojo/dijit/themes/claro/claro.css">
    <link rel="stylesheet" href="http://js.arcgis.com/3.7/js/esri/css/esri.css">
    <style>
      html, body { 
        height: 100%; width: 100%;
        margin: 0; padding: 0;
      } 
      body{
        background-color:white; overflow:hidden; 
        font-family: "Kimberley", sans-serif
      } 
      #header {
       -moz-border-radius: 5px;
       border-radius:5px;
       margin:5px;
       padding-top: 4px;
       padding-right: 15px;
       background-color:#211E21; 
       color:#FFC98C; 
       font-size:16pt; text-align:right;font-weight:bold;
       border: solid 2px #2A2F30;
       height:55px;
      }
      #subheader {
        font-size:small;
        color: #cfcfcf;
        text-align:right;
        padding-right:20px;
      }
      #map {
        margin:5px;
        border:solid 4px #2A2F30;
        padding:0px;
      }
      .shadow{
        -moz-border-radius: 6px;
        -webkit-border-radius: 6px;
        border-radius: 6px;
        -webkit-box-shadow: 0 8px 6px -6px #999;
        -moz-box-shadow: 0 8px 6px -6px #999;
        box-shadow: 0 8px 6px -6px #999;
      }
    </style>
    
    <script>var dojoConfig = { parseOnLoad: true };</script>
    <script src="http://js.arcgis.com/3.7/"></script>
    <script> 
      dojo.require("dijit.layout.BorderContainer");
      dojo.require("dijit.layout.ContentPane");
      dojo.require("esri.map");
      dojo.require("dojo.number");
      dojo.require("esri.layers.FeatureLayer");
      dojo.require("esri.dijit.InfoWindow");
      
      var map, trailLayer;
      var template;
      var soeParams;
      var soeURL = "http://sampleserver4.arcgisonline.com/ArcGIS/rest/services/Elevation/ESRI_Elevation_World/MapServer/exts/ElevationsSOE/ElevationLayers/1/GetElevationProfile";
      
      function init() {
        //This sample requires a proxy page to handle communications with the ArcGIS Server services. You will need to  
        //replace the url below with the location of a proxy on your machine. See the 'Using the proxy page' help topic 
        //for details on setting up a proxy page.
        esri.config.defaults.io.proxyUrl = "../proxy/proxy.php";


        map = new esri.Map("map", {
          basemap: "satellite",
          center: [-117.069, 36.215],
          zoom: 13
        });

        var infoWindow = new esri.dijit.InfoWindow({}, dojo.create("div", null, map.root));

        map.infoWindow.resize(625, 240);

        infoWindow.startup();
        map.setInfoWindow(infoWindow);

        
        //setup SOE parameters
        soeParams = {};
        soeParams.ImageWidth = 600;
        soeParams.ImageHeight= 200;
        soeParams.BackgroundColorHex="#ffffff";
        soeParams.DisplaySegments=false;
        soeParams.f="json";
        
        
        //add the trails feature layer to the map
        template = new esri.InfoTemplate();
        template.setTitle("<b>${notes}</b>");
        template.setContent(getTextContent);
        
        trailLayer = new esri.layers.FeatureLayer("http://sampleserver5.arcgisonline.com/ArcGIS/rest/services/LocalGovernment/Recreation/MapServer/1", {
          mode: esri.layers.FeatureLayer.MODE_ONDEMAND,
          infoTemplate:template,
          outFields: ["*"]
        });
       
       //create a new renderer for the feature layer
       var lineSymbol = new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID,new dojo.Color([0,255,0,.70]), 5);
       trailLayer.setRenderer(new esri.renderer.SimpleRenderer(lineSymbol));
       map.addLayer(trailLayer);
       
       //add world place names to the map
        var referenceLayer = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/Reference/World_Boundaries_and_Places/MapServer");
        map.addLayer(referenceLayer);

      }

      //Generate the content for the info window when the feature is clicked.
      function getTextContent(graphic) {
        var geometry = esri.geometry.webMercatorToGeographic(graphic.geometry);
        var deferred = new dojo.Deferred();
        
        //generate elevation profile
        soeParams.InputPolyline = dojo.toJson(geometry.toJson());
        esri.request({
        url: soeURL,
        content: soeParams,
        callbackParamName: "callback",
        load: function(fset) {
           deferred.callback("<img src='" + fset.profileImageUrl + "'/>");
        },
        error: function(error) {
           deferred.errback("Error occurred while generating profile");
        }
        });
        return deferred;
      }
      dojo.ready(init);
    </script> 
  </head> 
  <body class="claro"> 
    <div id="mainWindow" 
         data-dojo-type="dijit.layout.BorderContainer" 
         data-dojo-props="design:'headline', gutters:false" 
         style="width:100%; height:100%;">

      <div id="header" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'top'">
        Click a trail to view the elevation profile
      </div>

      <div id="map" data-dojo-type="dijit.layout.ContentPane" class="shadow" data-dojo-props="region:'top'"></div>

   </div>
  </body> 
</html>

[HaroldBostic]

Hello, this appears to work fine for featureLayers, however, I am trying to set the InforTemplate for individual graphics and this does not appear to work.

This works

var template = new esri.InfoTemplate();
                                            template.setTitle(identifyResultTemplates[result.layerName].title);

                                            template.setContent(mapcontext.getSitePhotos)

where mapcontext.getSitePhotos:

function getSitePhotos()
    {
       
        

        return 'Hello';
    }

but if I change the same function to return a deferred, the Infowindow does not populate:

function getSitePhotos()
    {
        var deferred = new dojo.Deferred();

        setTimeout(function () {
            deferred.callback('Hello');
            
        }, 2000);
        

        return deferred;
    }

Any clues as to what could be going wrong?

[HaroldBostic]

My issue is Popup don't support deferreds as stated here https://developers.arcgis.com/en/javascript/jshelp/intro_popuptemplate.html

[MarkTurnbull]

Can anyone provide confirmation that functions that return deferreds are or are not supported by the setContent method of the popupTemplate in ArcGIS API for Javascript v 3.12 ?

Thanks

[kaleem_anjum]

what is the alternate  for dojo.Deferred in 4.x ? 

var deferred = new dojo.Deferred();