AnsweredAssumed Answered

How do you access the attribute of a feature layer in arcgis javascript api 3.2?

Question asked by caramayo on Apr 20, 2018
Latest reply on Apr 24, 2018 by caramayo

I feel like I should be able to find the answer to this question, but I haven't been successful so far so I thought I would reach out for some help... I am making a web map similar in style to the Shortlist story map. There is a map with a layer that contains the locations of projects around the US (polygons) and a sidebar of cards. Each card is supposed to correspond to a project on the map. The map also has a filter tool that allows you to query the feature layer for a couple attributes. 


I want to connect my cards to their corresponding feature on the map so that when a person queries the map, they see only the polygons and corresponding cards. If a polygon is hidden due to the filter request, its corresponding card should hide too. Each card's id is the project's Project Number and each project has a ProjectNum field that contains the project number. The problem is, I can't figure out how to access the Project Number of each feature. How do you do this?

Thank you!


Below is the code I have so far:


], function(
) {

var map = new Map("viewDiv", {
basemap: "gray-vector",
center: [ -85.20127, 35.12355 ],
zoom: 1

// Add layer to the map

var serviceUrl = "";
var layer = new FeatureLayer(serviceUrl, {
outFields: [ "FY", "HISAProjects_final_1262017_cs_2", "HISAProjects_final_1262017_csv1", "HISAProjects_final_1262017_cs_4", "HISAProjects_final_1262017_cs_5", "HISAProjects_final_1262017_csv_", "HISAProjects_final_1262017_cs_3", "HISAProjects_final_1262017_cs_1", "HabitatData12_4_17_ProjectNum"],

infoTemplate: new PopupTemplate({
title: "{HISAProjects_final_1262017_cs_4}",
description: "<br />Lead PI: {HISAProjects_final_1262017_cs_5}"
+ "<br />Region: {HISAProjects_final_1262017_csv_}"
+ "<br />Year: {FY}"
+ "<br />Primary Habitat Type: {HISAProjects_final_1262017_cs_2}"
+ "<br />Secondary Habitat Type: {HISAProjects_final_1262017_cs_3}"
+ "<br />Distance from shore: {HISAProjects_final_1262017_csv1}"
+ "<br />Secondary Distance from shore: {HISAProjects_final_1262017_cs_1}"

// "Learn more.." link connected to individual main-areaCard info windows


var legend = new Legend({
map: map,
layerInfos: [{
layer: layer,
title: "Habitat Type"
}, "legendDiv");


// "Global" Variables
var filter1 = document.getElementById("filterhabitat");
var filter2 = document.getElementById("filterlocation");
var filter3 = document.getElementById("filteryear");
var button = document.getElementById("button");

map.on("load", function(evt){
button.addEventListener("click", function(e){
// console.log(filter1.options[filter1.selectedIndex].value);
// console.log(filter2.options[filter2.selectedIndex].value);
// console.log(filter3.options[filter3.selectedIndex].value);
habitatValue = filter1.options[filter1.selectedIndex].value;
distanceValue = filter2.options[filter2.selectedIndex].value;
yearValue = filter3.options[filter3.selectedIndex].value;
pushValues(habitatValue, distanceValue, yearValue);

}); //end of map event function

function pushValues (habitatValue, distanceValue, yearValue){
var expressionArray = [];

if (habitatValue) {
var str = `HISAProjects_final_1262017_cs_2 = '${habitatValue}'`;

if (distanceValue) {
var str = `HISAProjects_final_1262017_csv1 = '${distanceValue}'`;

if (yearValue) {
var str = `FY = '${yearValue}'`;


var definitionExpression = expressionArray.join(' AND ');


function updateDefinitionExpression(definitionExpression){
//var definitionExpression = "HISAProjects_final_1262017_cs_2 = 'PELAGIC' AND FY = '2010'";

function connectIds(){

projectNum = $('.clickable').attr('id');
//retrieve ProjectNum for feature


} //end updateDefinitionExpression function

});// end Function