don't show null attribute values in featureLayer popup with javascript api

[MikeBell]

Hi,

I'm just creating a simple map to display one point dataset. When the user clicks on a point I want a popup to display, some of the attribute fields contain null values and ideally I don't want these fields to be included in the popup if the value of the attribute is null. I've tried to find the answer to this question and have come across a solution when using data coming from a queryTaskLayer but I'm looking to do this on a featureLayer. Any suggestions on how to do this with a featureLayer?

Cheers,

Mike

[thejuskambi]

FeatureLayer has a infoTemplate property and you can use it to change the content. Check out this example

Format info window content | ArcGIS API for JavaScript

[MikeBell]

Hi,

Thanks for your reply. Yeah I originally had created a new PopupTemplate like this:

var asTemplate = new PopupTemplate({title: ""});

asTemplate.setContent("${Agency}<br/>" + "${Address_1}, ${Address_2}, ${Town}, ${Postcode}<br/>" + "${Telephone}<br/>"

+ "Area covered: ${Area_covered}<br/>" + "<a href=${Website} target = _blank>${Website}</a>");

But some of the features have null values on certain attributes so I tried to hide them by doing this:

var content = "";

if(${Address_2}){

  content += ", " + ${Address_2};

}

if(${Town}){

  content += ", ${Town}";

}

if(${Postcode}){

  content += ", ${Postcode}";

}

if(${Telephone}){

  content += ", ${Telephone}";

}

if(${Website}){

  content += "<br/><a href=${Website} target = _blank>${Website}</a>";

}

if(${Area_covered}){

  content += "<br/>Area covered: ${Area_covered}";

}

if(${Advice}){

  content += "<br/>${Advice}";

}

if(${Information}){

  content += "<br/>${Information}";

}

if(${Provider}){

  content += "<br/>${Provider}";

}

asTemplate.setContent("${Agency}<br/>" + "${Address_1}, ",content);

But it looks like referencing the attributes with curly brackets interferes with the if statement so that doesn't work. Any suggestions on how to get around this?

[TracySchloss · Accepted solution]

You need to create a function and set it as your infoContent.  I'm not using a popupTemplate, I'm using an infoTemplate, but it should be the same concept.

  var infoTemplate = new InfoTemplate();

  infoTemplate.setContent(generateInfoContent);

//creates string for info tag

  function generateInfoContent(graphic){

    var formatString = "";  

    var disclaimerTest = graphic.attributes.HOURS_OF_OPERATION_DISCLAIMER;

    var adaTest = graphic.attributes.ADA_ACCESS;

    var idTest = graphic.attributes.ID_REQUIRED;

//these fields always have data, so start with a string that contains them and then append the others only when they have values.

    formatString = "<b>"+graphic.attributes.FACILITY +"</b><br/>" +graphic.attributes.ADDRESS+"<br/>"

    + graphic.attributes.CITY+", " + graphic.attributes.STATE + "</br>"

    + "Phone: " + graphic.attributes.PHONE + "<br/>"

    + "Hours: " + graphic.attributes.HOURS_OF_OPERATION;

   if (disclaimerTest){

     formatString += "<br/>" + graphic.attributes.HOURS_OF_OPERATION_DISCLAIMER;

   }

  if (idTest && idTest !== 'UNK' ) {

    formatString += "<br/> ID Required?:  " + graphic.attributes.ID_REQUIRED;

  }

  if (adaTest && adaTest !== 'UNK' ) {

    formatString += "<br/>ADA access?:  " + graphic.attributes.ADA_ACCESS

  }

    return formatString; 

  } 

[MikeBell]

Thanks Tracy, that has worked a treat.

Cheers,

Mike