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
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;
Thanks Tracy, that has worked a treat.
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?
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
Signed in members can post, follow updates, and more. New here? Register a free account.
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.