Displaying default pop not working

[wizgis]

Hi Community,

I am trying to do a simple task in which I would like to view the pop-up of features when clicked on it using ArcGIS Maps SDK for JavaScript. I came across the following link https://community.esri.com/t5/arcgis-javascript-maps-sdk-questions/defaultpopuptemplateenabled-not-w... which suggests to add the following line : view.popup.defaultPopupTemplateEnabled = true; 

However, when I am trying to do the same in my code, there are no errors however, when I click on any feature it just gets highlighted and pop-up doesn't open. Am attaching the code here.

The layer on which I am running this code is a hosted feature layer published via Survey123 to ArcGIS Online

Am not sure if I am missing something here.

Any insights on this would be really helpful. 

require(["esri/config", "esri/Map", "esri/views/MapView", "esri/layers/FeatureLayer"], function(esriConfig, Map, MapView, FeatureLayer){
    
    esriConfig.apiKey = ""

    var map = new Map({
        basemap: "arcgis-topographic"
    });

    var view = new MapView({
        map: map,
        center: [77.18108, 28.53337],
        zoom: 15,
        container: "viewDiv"
    })

    view.popup.defaultPopupTemplateEnabled = true;

    const floralayer = new FeatureLayer({
        url: "XXXXXXX",
    });

    map.add(floralayer)
    
    });

[JeffreyThompson2]

The latest version of the API (4.27) dramatically changed how popups work, so old Community posts may not be accurate anymore. https://developers.arcgis.com/javascript/latest/release-notes/#breaking-changes

require(["esri/config", "esri/Map", "esri/views/MapView", "esri/layers/FeatureLayer", "esri/widgets/Popup"], function(esriConfig, Map, MapView, FeatureLayer, Popup){
    
    esriConfig.apiKey = ""

    var map = new Map({
        basemap: "arcgis-topographic",
        popup: new Popup({
          defaultPopupTemplateEnabled: true
       })
    });

    var view = new MapView({
        map: map,
        center: [77.18108, 28.53337],
        zoom: 15,
        container: "viewDiv"
    })

    const floralayer = new FeatureLayer({
        url: "XXXXXXX",
    });

    map.add(floralayer)
    
    });

These modifications should work for you, but you will not see the initial loading speed improvement of the latest API.

[wizgis]

Hi @JeffreyThompson2 

Thank you for sharing your insights I modified the code as suggested by you however, I still don't see any pop-up opening when clicking on the feature and now feature is also not getting highlighted like before. 

Please let me know if I might be missing something here.

[JeffreyThompson2 · Accepted solution]

I made a mistake in my previous code. popup is a property of MapView, not Map. Try this.

require(["esri/config", "esri/Map", "esri/views/MapView", "esri/layers/FeatureLayer", "esri/widgets/Popup"], function(esriConfig, Map, MapView, FeatureLayer, Popup){
    
    esriConfig.apiKey = ""

    var map = new Map({
        basemap: "arcgis-topographic"
    });

    var view = new MapView({
        map: map,
        center: [77.18108, 28.53337],
        zoom: 15,
        container: "viewDiv",
        popup: new Popup({
          defaultPopupTemplateEnabled: true
       })
    })

    const floralayer = new FeatureLayer({
        url: "XXXXXXX",
    });

    map.add(floralayer)
    
    });

[wizgis]

@JeffreyThompson2 

Thank you for your prompt response however, even after adding the popup template property in Map View object, no pop-up is displayed when I click on the feature, the feature does get highlighted however, no pop-up box appears. I have made sure that pop-up is enabled for the feature layer.

Am not sure if I am missing something here.  

[JeffreyThompson2]

Can you try adding another featureLayer to your map? It would be helpful to see if it is a problem with your map or the layer.

Are there any console errors?

Here are a couple other tricks to try.

    var view = new MapView({
        map: map,
        center: [77.18108, 28.53337],
        zoom: 15,
        container: "viewDiv",
        popup: new Popup({
          defaultPopupTemplateEnabled: true,
          popupEnabled: true
       })
    })

    var view = new MapView({
        map: map,
        center: [77.18108, 28.53337],
        zoom: 15,
        container: "viewDiv",
        popup: new Popup(...)
    })

[wizgis]

@JeffreyThompson2  I added a feature layer from sample server 6 and made modifications to the code as suggested however, still having the same issue. 

I have also checked console however, no errors are shown in console as well. 

[JeffreyThompson2]

I'm stumped. Just to confirm you are using 4.27? The solutions above will not work on any lower version.

I assume that the other feature layer did not show a popup as well.

Do you get a popup in the ArcGIS Online map viewer?

Have you tried adding popupEnabled: true to your featureLayer declaration?

You are getting no popup at all, not a popup with only a Zoom To button? The later happens when the popupTemplate is not properly defined.

[wizgis]

@JeffreyThompson2 

I am not sure what happened here but, today when I added the same code in a new file everything started to work and I was able to see the popups after clicking on the feature. A slight modification that I made was adding outFields key when creating feature layer object. 

Maybe a new file was all that was needed for it to work.  

Thank you for your patience and persistence on this.