davidraijmakers

Show find task results in a DataGrid ! For multiple Find Tasks

Discussion created by davidraijmakers on Dec 4, 2012
Latest reply on Dec 19, 2012 by pigili_sreenivasarao
I have a question. In this example they explain how to display result in a datagrid: http://help.arcgis.com/en/webapi/javascript/arcgis/help/jssamples_start.htm

But that is only possible with the fixed tableheader id's like:

          <th field="PARCELID">Parcel ID</th>
          <th field="OWNERNME1" >Owner 1</th>
          <th field="OWNERNME2">Owner 2</th>
          <th field="RESYRBLT ">Year Built</th>
          <th field="SITEADDRESS" width="100%">Address</th>

But i cant use this, because i use different find tasks with different parameters.
So i found this example: http://help.arcgis.com/en/webapi/javascript/arcgis/help/jssamples_start.htm#jssamples/fl_query_related_multiple.html

But in this example is one thing that doesnt work: and that's the identifier. If you click on any of the results in the datagrid ( with mfind tasks) then the setExtent doesnt pick the right one. It only picks the last found in the datagrid.
Does anyone know what im doing wrong?

Here's my code:

      function doFind() {
  //  
   var e = document.getElementById("QueryPicker");
   var strUser = e.options[e.selectedIndex].value;
   if (strUser==="Sporen"){
   
        findTask = new esri.tasks.FindTask("https://gis.strukton.com/ArcGIS/rest/services/ProRail_Data/MapServer");
         var findParams = new esri.tasks.FindParameters();
        findParams.returnGeometry = true;
        findParams.layerIds = [31];
findParams.searchFields = ["NR", "GeoSpoor"];
/*var gridTable = document.getElementById("grid1");
//gridTable.style.display = 'none';
   gridTable.style.visibility="hidden";

var gridTable1 = document.getElementById("grid");
gridTable1.style.visibility="visible";*/

        findParams.outSpatialReference = map.spatialReference;
  
  
  findParams.searchText = dojo.byId("ownerName").value;
  findTask.execute(findParams,showResults);
}
   else if (strUser==="Wissels"){
    findTask = new esri.tasks.FindTask("https://gis.strukton.com/ArcGIS/rest/services/ProRail_Data/MapServer");
         var findParams = new esri.tasks.FindParameters();
        findParams.returnGeometry = true;
        findParams.layerIds = [33];
findParams.searchFields = ["NR", "GeoWisselNR1", "GeoWisselNR2"];
/*var gridTable = document.getElementById("grid1");
gridTable.style.visibility="hidden";
var gridTable1 = document.getElementById("grid");
gridTable1.style.visibility="visible";*/
        findParams.outSpatialReference = map.spatialReference;
  
  
  findParams.searchText = dojo.byId("ownerName").value;
  findTask.execute(findParams,showResults);
   }
    else if (strUser==="sein"){
    findTask = new esri.tasks.FindTask("https://gis.strukton.com/ArcGIS/rest/services/ProRail_Data/MapServer");
         var findParams = new esri.tasks.FindParameters();
        findParams.returnGeometry = true;
        findParams.layerIds = [23];
findParams.searchFields = ["NUMMER", "GEOCODE"];
/*var gridTable = document.getElementById("grid");
gridTable.style.visibility="hidden";
var gridTable1 = document.getElementById("grid1");
gridTable1.style.visibility="visible";*/
        findParams.outSpatialReference = map.spatialReference;
  
  
  findParams.searchText = dojo.byId("ownerName").value;
  findTask.execute(findParams,showResults);
   }
   else if (strUser==="bovenleidingpaal"){
    findTask = new esri.tasks.FindTask("https://gis.strukton.com/ArcGIS/rest/services/ProRail_Data/MapServer");
         var findParams = new esri.tasks.FindParameters();
        findParams.returnGeometry = true;
        findParams.layerIds = [26];
  findParams.searchFields = ["NUMMER", "GEOCODE"];
/*var gridTable = document.getElementById("grid");
gridTable.style.visibility="hidden";
var gridTable1 = document.getElementById("grid1");
gridTable1.style.visibility="visible";*/
        findParams.outSpatialReference = map.spatialReference;
  
  
  findParams.searchText = dojo.byId("ownerName").value;
  findTask.execute(findParams,showResults);
   }
   else if (strUser==="Spoortoegang"){
    findTask = new esri.tasks.FindTask("https://gis.strukton.com/ArcGIS/rest/services/POI_Data/MapServer");
         var findParams = new esri.tasks.FindParameters();
        findParams.returnGeometry = true;
        findParams.layerIds = [0];
  findParams.searchFields = ["ToegangsNR"];
/*var gridTable = document.getElementById("grid");
gridTable.style.visibility="hidden";
var gridTable1 = document.getElementById("grid1");
gridTable1.style.visibility="visible";*/
        findParams.outSpatialReference = map.spatialReference;
  
  
  findParams.searchText = dojo.byId("ownerName").value;
  findTask.execute(findParams,showResults);
   }
   else if (strUser==="Kilometrering"){
    findTask = new esri.tasks.FindTask("https://gis.strukton.com/ArcGIS/rest/services/ProRail_Data/MapServer");
         var findParams = new esri.tasks.FindParameters();
        findParams.returnGeometry = true;
        findParams.layerIds = [20];
  findParams.searchFields = ["GEOCODET"];
/*var gridTable = document.getElementById("grid");
gridTable.style.visibility="hidden";
var gridTable1 = document.getElementById("grid1");
gridTable1.style.visibility="visible";*/
        findParams.outSpatialReference = map.spatialReference;
  
  
  findParams.searchText = dojo.byId("ownerName").value;
  findTask.execute(findParams,showResults);
   }
    else if (strUser==="Geocode"){
    findTask = new esri.tasks.FindTask("https://gis.strukton.com/ArcGIS/rest/services/ProRail_Data/MapServer");
         var findParams = new esri.tasks.FindParameters();
        findParams.returnGeometry = true;
        findParams.layerIds = [48];
  findParams.searchFields = ["GeocodeTekst"];
/*var gridTable = document.getElementById("grid");
gridTable.style.visibility="hidden";
var gridTable1 = document.getElementById("grid1");
gridTable1.style.visibility="visible";*/
        findParams.outSpatialReference = map.spatialReference;
  
  
  findParams.searchText = dojo.byId("ownerName").value;
  findTask.execute(findParams,showResults);
   }
   
}
        
        

  
   
 function showResults(results) {
        //This function works with an array of FindResult that the task returns
       var markerSymbol = new esri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_CIRCLE, 10,
   new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, 
   new dojo.Color([0,255,255]), 2),
   new dojo.Color([0,255,0,0]));
        var lineSymbol = new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID,
    new dojo.Color([0,255,255]), 4);
        var polygonSymbol = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID,
 new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID,
 new dojo.Color([0,255,255]), 4),new dojo.Color([0,255,255,0]));

        //find results return an array of findResult.
  map.graphics.clear();
        var dataForGrid = [];
        //Build an array of attribute information and add each found graphic to the map
        dojo.forEach(results, function(result) {
          var graphic = result.feature;
          dataForGrid.push([result.foundFieldName, result.value]);
          switch (graphic.geometry.type) {
          case "point":
            graphic.setSymbol(markerSymbol);
            break;
          case "polyline":
            graphic.setSymbol(lineSymbol);
            break;
          case "polygon":
            graphic.setSymbol(polygonSymbol);
            break;
          }
          map.graphics.add(graphic);
        });
        var data = {
   
          items: dataForGrid
        };
        var store = new dojo.data.ItemFileReadStore({
          data: data
        });
        grid.setStore(store);
      }


        //Zoom back to the initial map extent

      
   
   function onRowClickHandler(evt){
    
     //symbology for graphics
        
    
        var clickedTaxLotId = grid.getItem(evt.rowIndex).OBJECTID;
        var selectedTaxLot;

        dojo.forEach(map.graphics.graphics,function(graphic){
          if((graphic.attributes) && graphic.attributes.OBJECTID === clickedTaxLotId){
            selectedTaxLot = graphic;
            return;
          }
        });
  
 

  if ( selectedTaxLot.geometry.declaredClass == 'esri.geometry.Point' ) {
   
   
    
    var PointExtent = new esri.geometry.Extent();
PointExtent.xmin = selectedTaxLot.geometry.x - 100; //I'm using State Plane Feet, so that's 100 out from my point
PointExtent.ymin = selectedTaxLot.geometry.y - 100;
PointExtent.xmax = selectedTaxLot.geometry.x + 100;
PointExtent.ymax = selectedTaxLot.geometry.y + 100; 
map.setExtent(PointExtent);
    
    
    
     //map.centerAndZoom(selectedTaxLot.geometry);

   
  //map.setExtent(sp.getExtent().expand(3));

 
 // map.infoWindow.show(selectedTaxLot.geometry, map.getInfoWindowAnchor(sp));


  }
  else{

 var taxLotExtent = selectedTaxLot.geometry.getExtent();
        map.setExtent(taxLotExtent);
 
   //map.setExtent(mappoint);

}


And some HTML:

<div data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'bottom'" style="height:350px;" >
<table data-dojo-type="dojox.grid.DataGrid" jsid="grid" id="grid" data-dojo-props="rowsPerPage:'5', rowSelector:'20px'">
      <thead>
        <tr>

          <th field="0" width="auto" >
            Gezocht op
          </th>
          <th field="1" width="auto" >
            Gevonden
          </th>
        </tr>
      </thead>
    </table>
    </div>
        
        </div>

Outcomes