topic Re: Display Data from Related Table in Popup in ArcGIS JavaScript Maps SDK Questions

Display Data from Related Table in Popup

MichaelGlassman2 — Tue, 22 Jul 2014 16:35:50 GMT

With the release of the ArcGIS JavaScript API version 3.10 a new feature has been created that I have been struggling to implement. I have been working with this example: ArcGIS API for JavaScript Sandbox‌ with my own data to attempt to show data from a related table in the popup for a feature. Both the feature and the table are uploaded to a server in the same map service and when viewing the map service I can verify that the relationship does exist. When I click a feature the popup appears but only shows data from the feature and not the related table. I have attached and image that shows the issue. Any suggestions.

Re: Display Data from Related Table in Popup

JakeSkinner — Tue, 22 Jul 2014 18:51:30 GMT

Hi Michael,

It looks like you the 'Code' field specified a few times in the fieldInfos. Try specifying this only once and see if that works. You can take a look at a simpler sample here.

Re: Display Data from Related Table in Popup

williamcarr — Tue, 22 Jul 2014 19:45:17 GMT

Related tables gave me hell a few weeks ago. Double tap and make sure your ObjectID field labels are the same in both services. ObectID and ObjectID1 almost made me pull me hair out.

Re: Display Data from Related Table in Popup

MichaelGlassman2 — Wed, 23 Jul 2014 14:06:47 GMT

Jake,

Thanks for the reply. I removed the duplicate 'Code' fields but this did not improve the situation. I also tried the simpler sample you suggested but I encountered the same issue.

Re: Display Data from Related Table in Popup

MichaelGlassman2 — Wed, 23 Jul 2014 14:07:41 GMT

William,

I checked and both the feature and the table have the same OBJECTID field labels.

Re: Display Data from Related Table in Popup

JakeSkinner — Wed, 23 Jul 2014 15:17:06 GMT

I'm assuming you can't post the REST URL of the service you are working with?

Re: Display Data from Related Table in Popup

MichaelGlassman2 — Wed, 23 Jul 2014 15:18:44 GMT

No I cannot. I could possible take a few screenshots if there is a particular thing you wanted to see in the REST URL.

Re: Display Data from Related Table in Popup

BradyCallahan — Wed, 27 Aug 2014 20:53:15 GMT

Did you ever find a solution for this? I just ran into the same problem. I can see that the related values are returned to the client by examining the response in Firebug but can't figure out how to get it to display in the Popup.

My template is defined like this:

var popupTemplate = new PopupTemplate({

title: "{PARK_NAME}",

fieldInfos: [ {

fieldName: "POLYID",

visible: true

}, {

fieldName: "relationships/0/FEDNUM",

visible: true,

label: "FedNum"

}]

});

Below is the screenshot of the popup as well as the response shown in Firebug.

Re: Display Data from Related Table in Popup

williamcarr — Thu, 28 Aug 2014 11:55:30 GMT

Brady, I can't recall if this is the exact one that was working for me but it is the jest of it. When the infoTemplate s called it references getTextContent that populates the window from the related table query.

require([

"esri/map",

"esri/dijit/Popup",

"esri/dijit/PopupTemplate",

"esri/layers/FeatureLayer",

"esri/symbols/SimpleMarkerSymbol",

"esri/layers/ArcGISDynamicMapServiceLayer",

"esri/tasks/query", "esri/tasks/QueryTask",

"esri/tasks/FindParameters","esri/tasks/FindTask",

"dojo/dom-class",

"dojo/dom-construct",

"dijit/layout/ContentPane",

"dojo/on",

"dojox/charting/Chart",

"dojox/charting/themes/Dollar",

"dojo/domReady!"

], function(

Map,

Popup,

PopupTemplate,

FeatureLayer,

SimpleMarkerSymbol,

Dynamic,

Query,QueryTask,

FindParameters,FindTask,

domClass,

domConstruct,

ContentPane,

on,

Chart,

theme

){

//The popup is the default info window so you only need to create the popup and

//assign it to the map if you want to change default properties. Here we are

//noting that the specified title content should display in the header bar

var popup = Popup({

titleInBody: false

},domConstruct.create("div"));

var map = new Map("map", {

basemap: "satellite",

center: [-88.595, 38.937],

zoom: 11,

infoWindow: popup

});

//define the popup content using a popup template

//a custom chart theme (dollar) is specified. Note that you'll have to load

//then theme first

var template = new esri.InfoTemplate();

template.setTitle("Billing");

//template.setContent("hello");

template.setContent(getTextContent);

var imageParams = new esri.layers.ImageParameters();

imageParams.layerIds = [0,1,2,3,4,5,6,7,8,9];

imageParams.layerOption = esri.layers.ImageParameters.LAYER_OPTION_SHOW;

var dynamicMapServiceLayer = new esri.layers.ArcGISDynamicMapServiceLayer("Map service layer", {imageParameters:imageParams});

map.addLayer(dynamicMapServiceLayer);

var selectionSymbol = new esri.symbol.SimpleMarkerSymbol().setColor("red");

wellFeatureLayer = new esri.layers.FeatureLayer("feature layer", {

mode: esri.layers.FeatureLayer.MODE_SELECTION,

//infoTemplate: new esri.InfoTemplate("Well Well: ${OBJECTID_1}","${OBJECTID_1}")

infoTemplate: template

});

map.addLayers([dynamicMapServiceLayer]);

dojo.connect(wellFeatureLayer, "onSelectionComplete", findRelatedRecords);

map.addLayer(wellFeatureLayer);

dojo.connect(map, "onClick", findWells);

dojo.addClass(map.infoWindow.domNode, "myTheme");

function getTextContent(graphic){

return "<b>" + "OBJECTID: " + items[0].ESRI_OID + "</b><br/>" + "First Name: " + items[0].CUSTNAME + "</b><br/>" + "Address: " + items[0].ADDR1;

}

function findRelatedRecords(features) {

var relatedTopsQuery = new esri.tasks.RelationshipQuery();

relatedTopsQuery.outFields = ["*"];

//relatedTopsQuery.relationshipId = 3;

relatedTopsQuery.relationshipId = 0;

//relatedTopsQuery.objectIds = [features[0].attributes.OBJECTID];

relatedTopsQuery.objectIds = [features[0].attributes.OBJECTID];

wellFeatureLayer.queryRelatedFeatures(relatedTopsQuery, function(relatedRecords) {

console.log("related recs: ", relatedRecords);

if ( ! relatedRecords.hasOwnProperty(features[0].attributes.OBJECTID) ) {

console.log("No related records for ObjectID_1: ", features[0].attributes.OBJECTID_1);

return;

}

var fset = relatedRecords[features[0].attributes.OBJECTID];

//var fset = relatedRecords[features[0].attributes.OBJECTID];

items = dojo.map(fset.features, function(feature) {

return feature.attributes;

});

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

};

});

}

function findWells(evt) {

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;

wellFeatureLayer.selectFeatures(selectionQuery,esri.layers.FeatureLayer.SELECTION_NEW);

};

Good luck!

Re: Display Data from Related Table in Popup

MichaelGlassman2 — Thu, 28 Aug 2014 13:25:59 GMT

Brady Callahan‌,

I was never able to get this working in a web application but I was able to use the ArcGIS Online map to display relationships. I will give the suggestions of william carr‌ a try.

Re: Display Data from Related Table in Popup

BradyCallahan — Thu, 28 Aug 2014 14:21:31 GMT

Hmmmm.....

I can see how William Carr's implementation is one path to a possible solution. It needs some tweaking, like a loop to run through all the [items] returned to the getTextContext function so each one gets displayed in the infoWindow.

Mainly I was trying to avoid a multiple "Task" methodology where there are queries for the first click and then another query for the relationship and then another click to display the popup.

The out-of-the-box implementation of the popup at v 3.10 of the api handles the related query for single click solution, there just doesn't seem to be a way to call the returned records except using the mediaInfos structure which is irritating.

Re: Display Data from Related Table in Popup

williamcarr — Thu, 28 Aug 2014 15:09:02 GMT

Perhaps these examples by @John Grayson might help.

https://community.esri.com/message/396665?sr=search&searchId=efc06485-6510-4e98-8882-6df0f2d12a22&searchIndex=0#396665