Hello, I am trying to get the JS 2.1 Query Related Records sample script to work with some local data and I cannot get the related table records to show up. I am using ArcGIS Server 10, JS 2.1 , ArcSDE 10, and SQL Server 2008. The MapServer that I am referencing contains both a point feature class (0) and a table called Doc (1) with an associated 1:M relationship class.The related fields are called FeatureID, so should this replace the OBJECTID in the code? I've tried different scenarios with no luck. I am pretty new to all this so it's probably a simple fix, but I've been staring at this for way too long.<!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"/>
<title>Query RelatedRecords Example</title>
<link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.1/js/dojo/dijit/themes/tundra/tundra.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/tundraGrid.css">
<style type="text/css">
html, body {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
}
body {
background-color:#777;
overflow:hidden;
font-family: "Trebuchet MS";
}
#header {
background-color:#444;
color:orange;
font-size:15pt;
text-align:center;
font-weight:bold;
}
#footer {
background-color:#444;
color:orange;
font-size:10pt;
text-align:center;
}
</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" language="Javascript">
dojo.require("esri.map");
dojo.require("esri.tasks.query");
dojo.require("esri.toolbars.draw");
dojo.require("dojox.color.Palette");
dojo.require("esri.layers.FeatureLayer");
dojo.require("dojox.grid.DataGrid");
dojo.require("dojo.data.ItemFileReadStore");
dojo.require("dijit.layout.BorderContainer");
dojo.require("dijit.layout.ContentPane");
var map, wellFeatureLayer, toolbar, grid, store, resizeTimer;
function init() {
var startExtent = new esri.geometry.Extent({ "xmin": -107.75, "ymin": 30, "xmax": -105, "ymax": 40, "spatialReference": { "wkid": 4269} });
map = new esri.Map("mapDiv", { extent: esri.geometry.geographicToWebMercator(startExtent) });
dojo.connect(map, "onLoad", initDocQueryFunctionality);
var tiledLayer = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer");
map.addLayer(tiledLayer);
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_query_test/MapServer", { imageParameters: imageParams });
map.addLayer(dynamicLayer);
var selectionSymbol = new esri.symbol.SimpleMarkerSymbol().setColor("red");
pointFeatureLayer = new esri.layers.FeatureLayer("http://gis1ace/ArcGIS10/rest/services/MRG_query_test/MapServer/0", {
mode: esri.layers.FeatureLayer.MODE_SELECTION,
infoTemplate: new esri.InfoTemplate("Point", "<tr>Feature ID: <td>${FeatureID}</td></tr>")
});
pointFeatureLayer.setSelectionSymbol(selectionSymbol);
dojo.connect(pointFeatureLayer, "onSelectionComplete", findRelatedRecords);
map.addLayer(pointFeatureLayer);
dojo.connect(map, "onClick", findPoints);
}
function initDocQueryFunctionality(map) {
dojo.connect(dijit.byId('mapDiv'), 'resize', function () {
resizeMap();
});
}
function findRelatedRecords(features) {
var relatedDocQuery = new esri.tasks.RelationshipQuery();
relatedDocQuery.outFields = ["*"];
relatedDocQuery.relationshipId = 1;
relatedDocQuery.objectIds = [features[0].attributes.OBJECTID];
pointFeatureLayer.queryRelatedFeatures(relatedDocQuery, function (relatedRecords) {
var fset = relatedRecords[features[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 findPoints(evt) {
grid.setStore(null);
var selectionQuery = new esri.tasks.Query();
var tol = map.extent.getWidth() / map.width * 5;
var x = evt.mapPoint.x;
var y = evt.mapPoint.y;
var queryExtent = new esri.geometry.Extent(x - tol, y - tol, x + tol, y + tol, evt.mapPoint.spatialReference);
selectionQuery.geometry = queryExtent;
pointFeatureLayer.selectFeatures(selectionQuery, esri.layers.FeatureLayer.SELECTION_NEW);
}
//Handle resize of browser
function resizeMap() {
clearTimeout(resizeTimer);
resizeTimer = setTimeout(function () {
map.resize();
map.reposition();
}, 500);
}
dojo.addOnLoad(init);
</script>
</head>
<body class="tundra">
<!--TOPMOST LAYOUT CONTAINER-->
<div id="mainWindow" dojotype="dijit.layout.BorderContainer" design="headline" gutters="false" style="width:100%; height:100%;">
<!--HEADER SECTION-->
<div id="header" dojotype="dijit.layout.ContentPane" region="top" style="height:75px;">
Click on a well to select the well and select the related well log information for that well.
</div>
<!--CENTER SECTION-->
<!--CENTER CONTAINER-->
<div id="mapDiv" dojotype="dijit.layout.ContentPane" region="center" style="margin:5px;">
</div>
<!--RIGHT CONTAINER-->
<div dojotype="dijit.layout.ContentPane" region="right" style="width:500px;margin:5px;background-color:whitesmoke;">
<table dojoType="dojox.grid.DataGrid" jsid="grid" id="grid" rowsPerPage="5" rowSelector="20px" style="height:300px; width:300px">
<thead>
<tr>
<th field="FeatureID">Feature ID</th>
<th field="Title">Title</th>
<th field="FileName">File Name</th>
<th field="Description">Description</th>
</tr>
</thead>
</table>
</div>
</div>
</body>
<body class="tundra">
</body>
</html>
Please let me know if I left out anything. Thanks for your help!Trent
