This is my first time posting a question here.
I am working on a map application using ArcGIS Server 10 with Javascript API 2.1 and I am trying to figure out why I cannot return multiple selected features, within a FeatureLayer, with related SDE data to a dataGrid using the relationshipQuery task.
I am able to return one selected feature to the dataGrid showing the related data, but when I select more than one feature, only one of those features are returned to the dataGrid with associated related data. For testing purpose, when I take out the relationshipQuery task from my script, all selected features are returned to the dataGrid, but of course without the related data.
Has anyone run into this before and have a solution? Thanks for your help!
Trent
My code below:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=7" />
<!--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>Test - Selection Box</title>
<link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.1/js/dojo/dijit/themes/soria/soria.css" />
<link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.1/js/dojo/dojox/grid/resources/Grid.css"/>
<link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.1/js/dojo/dojox/grid/resources/SoriaGrid.css"/>
<style type="text/css">
}
.soria .dojoxGridHeader .dojoxGridCell {
color:peru !important;
}
</style>
<script type="text/javascript">
djConfig = {
parseOnLoad: true
}
</script>
<script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.1"></script>
<script type="text/javascript">
dojo.require("dijit.dijit"); // optimize: load dijit layer
dojo.require("dijit.layout.BorderContainer");
dojo.require("dijit.layout.ContentPane");
dojo.require("esri.map");
dojo.require("esri.toolbars.draw");
dojo.require("esri.layers.FeatureLayer");
dojo.require("esri.tasks.query");
dojo.require("dojox.grid.DataGrid");
dojo.require("dojo.data.ItemFileReadStore");
var map, toolbar, featureLayer, grid;
function init() {
var initialExtent = new esri.geometry.Extent({ "xmin": -107.75, "ymin": 30, "xmax": -105, "ymax": 40, "spatialReference": { "wkid": 4269} });
var map = new esri.Map("map", { extent: esri.geometry.geographicToWebMercator(initialExtent), slider: true, nav: true });
dojo.connect(map, 'onLoad', function (map) {
//initialize the toolbar
toolBar = new esri.toolbars.Draw(map);
dojo.connect(toolBar, "onDrawEnd", onDrawEnd);
dojo.connect(dijit.byId('map'), 'resize', resizeMap);
});
var basemap = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer");
var imageParams = new esri.layers.ImageParameters();
imageParams.layerIds = [0];
imageParams.layerOption = esri.layers.ImageParameters.LAYER_OPTION_SHOW;
var dynamicLayer = new esri.layers.ArcGISDynamicMapServiceLayer("http://gis1ace/ArcGIS10/rest/services/MRG_Point/MapServer", { imageParameters: imageParams });
featureLayer = new esri.layers.FeatureLayer("http://gis1ace/ArcGIS10/rest/services/MRG_Point/MapServer/0", {
mode: esri.layers.FeatureLayer.MODE_SELECTION,
outFields: ["*"]
});
featureLayer.setSelectionSymbol(new esri.symbol.SimpleMarkerSymbol().setSize(8).setColor(new dojo.Color([160, 214, 238])));
/*var selectionSymbol = new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([255, 255, 0, 0.5]));
selectionSymbol.setOutline(new esri.symbol.SimpleLineSymbol("dashdot", new dojo.Color([255, 0, 0]), 2));
featureLayer.setSelectionSymbol(selectionSymbol);*/
map.addLayer(basemap);
map.addLayer(dynamicLayer);
map.addLayer(featureLayer);
dojo.connect(featureLayer, "onSelectionComplete", findRelatedRecords);
}
// select features using toolbar and build query
function onDrawEnd(extent) {
toolBar.deactivate();
//select features within the draw extent
var query = new esri.tasks.Query();
query.geometry = extent;
//execute query
featureLayer.selectFeatures(query, esri.layers.FeatureLayer.SELECTION_NEW);
}
//Relationship query
function findRelatedRecords(records) {
var relatedDocQuery = new esri.tasks.RelationshipQuery();
relatedDocQuery.outFields = ["*"];
relatedDocQuery.relationshipId = 1;
relatedDocQuery.objectIds = [records[0].attributes.OBJECTID];
featureLayer.queryRelatedFeatures(relatedDocQuery, function (relatedRecords) {
var fset = relatedRecords[records[0].attributes.OBJECTID];
var items = dojo.map(fset.features, function (feature) {
return feature.attributes;
});
//Create data object to be used in store
var data = {
identifier: "OBJECTID", //This field needs to have unique values
label: "OBJECTID", //Name field for display. Not pertinent to a grid but may be used elsewhere.
items: items
};
//Create data store and bind to grid.
store = new dojo.data.ItemFileReadStore({ data: data });
grid.setStore(store);
grid.setQuery({ OBJECTID: '*' });
});
}
function resizeMap() {
//resize the map when the browser resizes
var resizeTimer;
clearTimeout(resizeTimer);
resizeTimer = setTimeout(function () {
map.resize();
map.reposition();
}, 500);
}
dojo.addOnLoad(init);
</script>
</head>
<body class="soria">
<div id="mainWindow" dojotype="dijit.layout.BorderContainer" design="headline" gutters="true" style="width:600px; height:700px;">
<div dojotype="dijit.layout.ContentPane" region="top">
<button dojoType="dijit.form.Button" onClick="toolBar.activate(esri.toolbars.Draw.EXTENT);">Select Layer</button>
<button dojoType="dijit.form.Button" onClick="toolBar.deactivate();featureLayer.clearSelection();">Clear Selection</button><br />
</div>
<div id="map" region="center" dojotype="dijit.layout.ContentPane" style="border:1px solid #000;"></div>
</div>
<div dojotype="dijit.layout.ContentPane" region="bottom" style="height:150px; width="100%;"">
<table dojoType="dojox.grid.DataGrid" jsid="grid" id="grid" rowSelector="20px" selectionMode="none">
<thead>
<tr>
<th field="FeatureID">Feature ID</th>
<th field="Title" width="25%">Title</th>
<th field="FileName" width="10%">File Name</th>
<th field="Description" width="100%">Description</th>
</tr>
</thead>
</table>
</div>
</body>
</html>
edit -- Here's how I added the suggested code:
function findRelatedRecords(records) {
var relatedDocQuery = new esri.tasks.RelationshipQuery();
var queryIds = dojo.map(records, function (rec) { return rec.attributes.OBJECTID });
relatedDocQuery.outFields = ["*"];
relatedDocQuery.relationshipId = 1;
relatedDocQuery.objectIds = [queryIds];
featureLayer.queryRelatedFeatures(relatedDocQuery, function (relatedRecords) {
var fset = relatedRecords[queryIds];
var items = dojo.map(fset.features, function (feature) {
return feature.attributes;
});
