Problem getting result of geoprocessing task to display on web map

[JodiCross]

I'm new to JavaScript and using geoprocessing services, so maybe this is simple syntax mistake, but I've spent numerous days trying to figure it out and I'm completely stuck.

I???m having problems getting the result of our geoprocessing service to display in our web application. The service is a simple select by attributes task that outputs a polygon feature (inputs are a choice list of feature classes, and an SQL statement). I???ve been able to return the polygon geometry as a graphic (which I know from console log statements) but when I try to add the graphic to the map nothing happens. Does anyone have any ideas? They would be much appreciated!!

require(["dojo/dom",
          "dojo/_base/array",
          "dojo/parser",
          "dijit/registry",
          "esri/domUtils",
          "esri/map",
          "esri/graphic",
          "esri/layers/GraphicsLayer",
          "esri/layers/FeatureLayer",
          "esri/tasks/Geoprocessor",
          "esri/tasks/FeatureSet",
          "dijit/layout/BorderContainer",
          "dijit/layout/ContentPane"],
    function(dom, array, locale, parser, registry,
             domUtils, Map, Graphic, GraphicsLayer, FeatureLayer, Geoprocessor, FeatureSet){
      var gpServiceUrl= "http://<server>/arcgis/rest/services/Pipelines/ExportHazardCatchment/GPServer/Select";
      
      parser.parse();

      var map = new Map("map",{
        basemap: "streets",
        center: [-122.81, 45.466],
        zoom: 8
      });

      //Run the gp task 
      var gp = new Geoprocessor(gpServiceUrl);
      gp.setOutSpatialReference({wkid:102001});
      
      function selectCatchment(){
        var client = dom.byId('clientList').value;
        console.log(client);
        var params = {"input_features": client, 
          "output_feature_class": JSON,
          "where_clause": buildDefinitionQuery()
        };
        gp.submitJob(params, gpJobComplete, gpJobStatus, gpJobFailed);
      }

    function gpJobComplete(jobInfo) {
    console.log("in JobComplete");
    var status = jobInfo.jobStatus;
    if (status === "esriJobSucceeded"){
           console.log("success, jobId:" + jobInfo.jobId);
           var results = gp.getResultData(jobInfo.jobId, "out_feature_class", onTaskResultComplete);
           console.log("past getResultsData");
           console.log(results);
         }
    }
 
 
    function onTaskResultComplete(paramResult) {
      // Retrieve the value of the parameter from the paramresult
      var featureSet = paramResult.value;
      console.log(featureSet);
    
      // Create a symbol based on the geometry. 
      var simplePolySymbol = new esri.symbol.SimpleFillSymbol();
      simplePolySymbol.setOutline(new esri.symbol.SimpleLineSymbol(
                  esri.symbol.SimpleLineSymbol.STYLE_SOLID,
                  new dojo.Color([0,0,0,0.5]), 1));
      simplePolySymbol.setColor(new dojo.Color([255,0,0,0.7]));
      
       var gra = new Graphic(featureSet);
       console.log(gra);

      map.graphics.add(gra);
        
    }

      function gpJobStatus(jobInfo){
     console.log(jobInfo.jobStatus);
      }

      function gpJobFailed(error){
   console.log("Error");
     alert("Error:"+ error); 
       
      }

      function buildDefinitionQuery(){
        var defQuery;
        //get input info from form and build definition expression
        var hazardIDs = dojo.byId('query').value;
        defQuery = "\"HazardID\"=" + hazardIDs;
        console.log(defQuery);
        
        return defQuery;
      }
    app = {
        selectCatchment: selectCatchment
      };
      return app;
  
      
  });

 
Here is a screen shot of the page from our gp task:[ATTACH=CONFIG]33661[/ATTACH]

[Noah-Sager]

Not sure, but one things leaped out at me, and that is the order of the positional arguments in the callback function. In AMD style, the order is vital to mapping the arguments to the modules.

require(["dojo/dom",
          "dojo/_base/array",
          "dojo/parser",
          "dijit/registry",
          "esri/domUtils",
          "esri/map",
          "esri/graphic",
          "esri/layers/GraphicsLayer",
          "esri/layers/FeatureLayer",
          "esri/tasks/Geoprocessor",
          "esri/tasks/FeatureSet",
          "dijit/layout/BorderContainer",
          "dijit/layout/ContentPane"],
    function(dom, array, locale, parser, registry,
             domUtils, Map, Graphic, GraphicsLayer, FeatureLayer, Geoprocessor, FeatureSet){

So "dojo/dom" is mapped to dom, "dojo/_base/array" is mapped to array, and  "dojo/parser" is mapped to locale. You can see how the rest of the variables will be incorrect.

Here is an excellent blog that discusses the AMD style.

On further thought, I'm actually surprised that the map displayed at all in this application, so I may be wrong.

-Noah

[JodiCross]

Thanks, but that was actually a typo in the code I added to the post. My bad.

Here is an updated/cleaned up version:

require(["dojo/dom",
          "dojo/_base/array",
          "dojo/parser",
          "dijit/registry",
          "esri/domUtils",
          "esri/map",
          "esri/graphic",
          "esri/tasks/Geoprocessor",
          "dijit/layout/BorderContainer",
          "dijit/layout/ContentPane"],
    function(dom, array, parser, registry,
             domUtils, Map, Graphic, Geoprocessor){

      var gpServiceUrl= "http://<server>/arcgis/rest/services/Pipelines/ExportHazardCatchment/GPServer/Select";
      
      parser.parse();

      var map = new Map("map",{
        basemap: "streets",
        center: [-122.81, 45.466],
        zoom: 8
      });

      //Run the gp task 
      var gp = new Geoprocessor(gpServiceUrl);
      gp.setOutSpatialReference({wkid:102001});
      
      function selectCatchment(){
        var client = dom.byId('clientList').value;
        console.log(client);
        var params = {"input_features": client, 
          "output_feature_class": JSON,
          "where_clause": buildDefinitionQuery()
        };
        gp.submitJob(params, gpJobComplete, gpJobStatus, gpJobFailed);
      }

    function gpJobComplete(jobInfo) {
     console.log("in JobComplete");
    var status = jobInfo.jobStatus;
    if (status === "esriJobSucceeded"){
           console.log("success, jobId:" + jobInfo.jobId);
           var results = gp.getResultData(jobInfo.jobId, "out_feature_class", onTaskResultComplete);
           console.log("past getResultsData");
           console.log(results);
         }
    }
  
    function onTaskResultComplete(paramResult) {
      // Retrieve the value of the parameter from the paramresult
      var featureSet = paramResult.value;
      console.log(featureSet);
    
      // Create a symbol based on the geometry. 
      var simplePolySymbol = new esri.symbol.SimpleFillSymbol();
      simplePolySymbol.setOutline(new esri.symbol.SimpleLineSymbol(
                  esri.symbol.SimpleLineSymbol.STYLE_SOLID,
                  new dojo.Color([0,0,0,0.5]), 1));
      simplePolySymbol.setColor(new dojo.Color([255,0,0,0.7]));
      
       var gra = new Graphic(featureSet);
       console.log(gra);

      if (map.loaded){
      console.log("map loaded");
      map.graphics.add(gra);
      } 
        
    }

      function gpJobStatus(jobInfo){
     console.log(jobInfo.jobStatus);
      }

      function gpJobFailed(error){
   console.log("Error");
     alert("Error:"+ error); 
       
      }

      function buildDefinitionQuery(){
        var defQuery;
        //get input info from form and build definition expression
        var hazardIDs = dojo.byId('query').value;
        defQuery = "\"HazardID\"=" + hazardIDs;
        console.log(defQuery);
        
        return defQuery;
      }
    app = {
        selectCatchment: selectCatchment
      };
      return app;
    
  });

Now I get an error in the web console, that shows up right around where I try to add the graphic to the map:

[object Error] ".cache["esri/layers/GraphicsLayer"]/</C<._updateExtent@http://js.arcgis.com/3.9/:554
.cache["esri/layers/GraphicsLayer"]/</C<.add@http://js.arcgis.com/3.9/:584
onTaskResultComplete@http://developers.arcgis.com/javascript/sandbox/sandbox.html?sample=gp_resultmapservice:156
.cache["esri/tasks/Task"]/</d<._successHandler@http://js.arcgis.com/3.9/:500
.cache["esri/tasks/Geoprocessor"]/</d<._getResultDataHandler@http://js.arcgis.com/3.9/:295
.cache["dojo/_base/lang"]/</h.hitch/<@http://js.arcgis.com/3.9/:174
.cache["esri/tasks/Geoprocessor"]/</d<.getResultData/g._pendingDfd<.load@http://js.arcgis.com/3.9/:295
z/<@http://js.arcgis.com/3.9/:640
c@http://js.arcgis.com/3.9/:74
d@http://js.arcgis.com/3.9/:74
.cache["dojo/_base/Deferred"]/</b.Deferred/this.callback@http://js.arcgis.com/3.9/:75
c@http://js.arcgis.com/3.9/:74
d@http://js.arcgis.com/3.9/:74
.cache["dojo/_base/Deferred"]/</b.Deferred/this.callback@http://js.arcgis.com/3.9/:75
c@http://js.arcgis.com/3.9/:74
d@http://js.arcgis.com/3.9/:74
.cache["dojo/_base/Deferred"]/</b.Deferred/this.callback@http://js.arcgis.com/3.9/:75
f/<@http://js.arcgis.com/3.9/:636
c@http://js.arcgis.com/3.9/:74
d@http://js.arcgis.com/3.9/:74
.cache["dojo/_base/Deferred"]/</b.Deferred/this.callback@http://js.arcgis.com/3.9/:75
c@http://js.arcgis.com/3.9/:75
d@http://js.arcgis.com/3.9/:74
.cache["dojo/_base/Deferred"]/</b.Deferred/this.callback@http://js.arcgis.com/3.9/:75
c@http://js.arcgis.com/3.9/:75
d@http://js.arcgis.com/3.9/:74
.cache["dojo/_base/Deferred"]/</b.Deferred/this.callback@http://js.arcgis.com/3.9/:75
c@http://js.arcgis.com/3.9/:74
d@http://js.arcgis.com/3.9/:74
.cache["dojo/_base/Deferred"]/</b.Deferred/this.callback@http://js.arcgis.com/3.9/:75
c@http://js.arcgis.com/3.9/:74
d@http://js.arcgis.com/3.9/:74
.cache["dojo/_base/Deferred"]/</b.Deferred/this.callback@http://js.arcgis.com/3.9/:75
.cache["dojo/_base/xhr"]/</b.xhr/<@http://js.arcgis.com/3.9/:191
.cache["dojo/Deferred"]/</k@http://js.arcgis.com/3.9/:195
.cache["dojo/Deferred"]/</r@http://js.arcgis.com/3.9/:195
.cache["dojo/Deferred"]/</f/this.resolve@http://js.arcgis.com/3.9/:197
.cache["dojo/Deferred"]/</a@http://js.arcgis.com/3.9/:196
.cache["dojo/Deferred"]/</k@http://js.arcgis.com/3.9/:196
.cache["dojo/Deferred"]/</r@http://js.arcgis.com/3.9/:195
.cache["dojo/Deferred"]/</f/this.resolve@http://js.arcgis.com/3.9/:197
.cache["dojo/Deferred"]/</a@http://js.arcgis.com/3.9/:196
.cache["dojo/Deferred"]/</k@http://js.arcgis.com/3.9/:196
.cache["dojo/Deferred"]/</r@http://js.arcgis.com/3.9/:195
.cache["dojo/Deferred"]/</f/this.resolve@http://js.arcgis.com/3.9/:197
.cache["dojo/Deferred"]/</a@http://js.arcgis.com/3.9/:196
.cache["dojo/Deferred"]/</k@http://js.arcgis.com/3.9/:196
.cache["dojo/Deferred"]/</r@http://js.arcgis.com/3.9/:195
.cache["dojo/Deferred"]/</f/this.resolve@http://js.arcgis.com/3.9/:197
m@http://js.arcgis.com/3.9/:157
f@http://js.arcgis.com/3.9/:160
"