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-working-with/td-p/1054565 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: "xyz",
    });

    map.add(floralayer)
    
    });

 

Jeff.Thompson@arlingtontx.gov_arlingtontx

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: "xyz",
    });

    map.add(floralayer)
    
    });