Take the 2-minute tour ×
Geographic Information Systems Stack Exchange is a question and answer site for cartographers, geographers and GIS professionals. It's 100% free, no registration required.

I am trying to add show data in a Dojo data grid of the selected features, here is the ESRI original solution:

ESRI solution select feature layer and calculate sum gas production

The "findFeatures" function gets the list of selected features but "queryRelatedFeatures" method failing to execute.

Any help will be appreciated:

<!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,IE=9" />
    <!--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>Layer in a map service - [ON-DEMAND]</title>
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/2.4/js/dojo/dijit/themes/claro/claro.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/ClaroGrid.css"/>
    <script type="text/javascript">djConfig = { parseOnLoad:true };</script>
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.4"></script>

    <script type="text/javascript">
        dojo.require("esri.map");
        dojo.require("esri.layers.FeatureLayer");
        dojo.require("esri.toolbars.navigation");
        dojo.require("dijit.Toolbar");
        dojo.require("dijit.layout.BorderContainer");
        dojo.require("dijit.layout.ContentPane");
        dojo.require("esri.tasks.query");
        dojo.require("dojox.grid.DataGrid");
        dojo.require("dojo.data.ItemFileReadStore");

        var selectionToolbar,  grid,featureLayer,navToolbar;

        function init() {
            var initialExtent = new esri.geometry.Extent(-97.5328,37.4344,-97.2582,37.64041, new esri.SpatialReference({wkid:4326}) );
            var map = new esri.Map("map", { extent: esri.geometry.geographicToWebMercator(initialExtent), slider: true, nav: true });
            dojo.connect(map, "onLoad", initSelectToolbar);
            var baseMapLayer = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer");
            map.addLayer(baseMapLayer);

            var fieldsSelectionSymbol = new esri.symbol.SimpleFillSymbol().setColor(new dojo.Color([255,255,0,0.5]));
            fieldsSelectionSymbol.setOutline(new esri.symbol.SimpleLineSymbol("dashdot", new dojo.Color([255,0,0]), 2));

            var content = "<b>Status</b>: ${STATUS}" +
                    "<br><b>Cummulative Gas</b>: ${CUMM_GAS} MCF" +
                    "<br><b>Total Acres</b>: ${APPROXACRE}" +
                    "<br><b>Avg. Field Depth</b>: ${AVG_DEPTH} meters";
            var infoTemplate = new esri.InfoTemplate("${FIELD_NAME}", content);

            featureLayer = new esri.layers.FeatureLayer("http://sampleserver3.arcgisonline.com/ArcGIS/rest/services/Petroleum/KSPetro/MapServer/1",{
                mode: esri.layers.FeatureLayer.MODE_ONDEMAND,
                infoTemplate: infoTemplate,
                outFields: ["*"]
            });


            featureLayer.setDefinitionExpression("PROD_GAS='Yes'");
            featureLayer.setSelectionSymbol(fieldsSelectionSymbol);

            dojo.connect(featureLayer, "onSelectionComplete", findFeatures);

            dojo.connect(featureLayer, "onSelectionClear", function(features) {
                //dojo.byId('messages').innerHTML = "<i>No Selected Fields</i>";
            });

            navToolbar = new esri.toolbars.Navigation(map);

            dojo.connect(navToolbar, "onExtentHistoryChange", extentHistoryChangeHandler);

            map.addLayer(featureLayer);
        }

        function initSelectToolbar(map) {
            selectionToolbar = new esri.toolbars.Draw(map);
            var selectQuery = new esri.tasks.Query();

            dojo.connect(selectionToolbar, "onDrawEnd", function(geometry) {
                selectionToolbar.deactivate();
                selectQuery.geometry = geometry;
                featureLayer.selectFeatures(selectQuery, esri.layers.FeatureLayer.SELECTION_NEW);
            });

        }
        function extentHistoryChangeHandler() {
            dijit.byId("zoomprev").disabled = navToolbar.isFirstExtent();
            dijit.byId("zoomnext").disabled = navToolbar.isLastExtent();
        }


        function findFeatures(features) {
            var relatedQuery = new esri.tasks.RelationshipQuery();
            var queryIds = dojo.map(features, function (rec) { return rec.attributes.OBJECTID });
            relatedQuery.outFields = ["*"];
            relatedQuery.relationshipId = 0;
            relatedQuery.objectIds = [queryIds];

            featureLayer.queryRelatedFeatures(relatedQuery, function (relatedRecords) {
                var fset = relatedRecords[queryIds];
                var items = dojo.map(fset.features, function (feature) {
                    return feature.attributes;
                });

                var data = {
                    identifier: "OBJECTID",
                    label: "OBJECTID",
                    items: items
                };


                store = new dojo.data.ItemFileReadStore({ data: data });
                grid.setStore(store);
                grid.setQuery({ OBJECTID: '*' });
            });

        }

        dojo.addOnLoad(init);
    </script>

</head>

<body class="claro">
<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="selectionToolbar.activate(esri.toolbars.Draw.EXTENT);">Select Fields</button>
    <button dojoType="dijit.form.Button" onClick="featureLayer.clearSelection();">Clear Selection</button>
    <button id="zoomprev" dojoType="dijit.form.Button" onclick="navToolbar.zoomToPrevExtent();">Prev</button>
    <button id="zoomnext" dojoType="dijit.form.Button" onclick="navToolbar.zoomToNextExtent();">Next</button>

    </div>

    <div id="map" region="center" dojotype="dijit.layout.ContentPane" style="border:1px solid #000;"></div>

    <div dojotype="dijit.layout.ContentPane" region="bottom" style="height:150px; width:100%;">
        <div> </div>
    <span id="messages"></span>
        <div>
            <table dojoType="dojox.grid.DataGrid" jsid="grid" id="grid" rowSelector="20px" selectionMode="none" style="height:300px; width:600px">
                <thead>
                <tr>
                    <th field="OBJECTID" width="100px">ID</th>
                    <th field="STATUS" width="100px">Status</th>
                    <th field="CUMM_GAS" width="150px">Total GAS</th>
                    <th field="APPROXACRE" Width="150px">Total Acre</th>
                </tr>
                </thead>
            </table>
        </div>
    </div>

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

closed as unclear what you're asking by Devdatta Tengshe, BradHards, Paul, Chad Cooper, Jason Scheirer Jul 21 at 13:43

Please clarify your specific problem or add additional details to highlight exactly what you need. As it's currently written, it’s hard to tell exactly what you're asking. See the How to Ask page for help clarifying this question.If this question can be reworded to fit the rules in the help center, please edit the question.

This site is currently not accepting new answers.

Browse other questions tagged .