In my web-app I can select a feature and open an attribute table that shows related fields.
But I cannot figure out what to add to the code to zoom to the location of a related record when I click on the table.
// DataGrid //
//add a link to the popup that for getting related records
var link = domConstruct.create("a",{
"class": "action",
"id": "relatedLink",
"innerHTML": "Show Related Records", //text that appears in the popup for the link
"href": "javascript: void(0);"
}, query(".actionList", this.map.infoWindow.domNode)[0]);
on(link, "click", function(){
//Get info from the selected feature
var feature = map.infoWindow.getSelectedFeature();
var layer = feature.getLayer();
var OIDField = layer.objectIdField;
var oids = feature.attributes[OIDField];
//Setup the relationship query
var relatedQuery = new RelationshipQuery();
relatedQuery.outFields = ["ROUTE_1","ROUTE_2","NAME","GROUP_","LENGTH", "OBJECTID"];
relatedQuery.relationshipId = 0;
relatedQuery.objectIds = [oids];
//Perform the query
layer.queryRelatedFeatures(relatedQuery, function(relatedRecords){
//get the related records for the input OID. In this case there
//is just one object id.
clearGrid();
var featureSet = relatedRecords[oids];
if(featureSet && featureSet.features){
createTable(featureSet);
}else{
console.log("No related records");
}
});
});function clearGrid(){
//clear existing grid
if(grid){
grid.set("store",new Memory({data:[]}));
domUtils.hide(grid.domNode);
}
}
function createTable(featureSet, info){
var data = [];
array.forEach(featureSet.features, function(r){
data.push(r.attributes);
});
//define the columns
var relatedLayer = featureSet.features[0].getLayer();
var columns = {
var memoryStore = new Memory({data: data});
grid = new Grid({
columns: columns
},"tableContainer");
grid.set("store", memoryStore);
domUtils.show(grid.domNode);
}