Listener on Button inside InfoTemplate

Question

Hello, Im having an issue with the addEventListener for a button that i put inside a infoTemplate. I have the following code: var deferred = identifyTask .execute(identifyParams) .addCallback(function (response) { var filtered = response.filter(e=>{ return e.layerName =='Luminarias'; }); return arrayUtils.map(filtered, function (result) { var feature = result.feature; var layerName = result.layerName; feature.attributes.layerName = layerName; if (layerName === 'Luminarias') { var template = ap_info(feature) feature.setInfoTemplate(template); } return feature; }); }); mapp.infoWindow.setFeatures([deferred]); mapp.infoWindow.show(event.mapPoint); deferred.then(()=>{ document.getElementById("editar_btn").addEventListener('click', (e)=>{console.log(e,"button")}); }) });‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍ And then where i make the info template: function ap_info(feature){ var content = `<div style=padding-top: 10px;>ROTULO: ${feature.attributes.ROTULO}<br /></div> <div style=padding-top: 10px;>Tipo Conexión: ${feature.attributes.TIPO_CONEXION}<br /></div> <div style=padding-top: 10px;>Tipo: ${feature.attributes.TIPO}<br /></div> <div style=padding-top: 10px;>Propiedad: ${feature.attributes.PROPIEDAD}<br /></div> <div style=padding-top: 10px;>Medido: ${feature.attributes.MEDIDO_TERRENO}<br /><Button class="ui button btn_busqueda" id="editar_btn"">Editar</Button></div>`; var title = "ID Luminaria " + feature.attributes.ID_LUMINARIA; var infoTemplate = new InfoTemplate(); infoTemplate.setTitle(title); infoTemplate.setContent(content); return infoTemplate; }‍‍‍‍‍‍‍‍‍‍‍‍‍ So how u see, in the info template i place the button inside the content. So i need to make the button work for each feature with a listener function that returns the current information shown in the infoWindow. Any ideas? thanks in advice for the help!

EvelynHernandez · Answer

Ok, i make it work, but if i want to get the attributes from the infowindow when its more than 1 result?, like, lets say we have 2 results for the same point, but i only want to get the attributes from the second one . Here is what i have in my code: mapp.on('click', (event)=>{ var identifyTask, identifyParams; identifyTask = new IdentifyTask(layers.read_dynamic_ap(this.props.token)); identifyParams = new IdentifyParameters(); identifyParams.tolerance = 10; identifyParams.returnGeometry = true; identifyParams.layerIds = [0, 1]; identifyParams.layerOption = IdentifyParameters.LAYER_OPTION_ALL; identifyParams.width = mapp.width; identifyParams.height = mapp.height; identifyParams.geometry = event.mapPoint; identifyParams.mapExtent = mapp.extent; var onlyLum = []; var deferred = identifyTask .execute(identifyParams) .addCallback(function (response) { var filtered = response.filter(e=>{ return e.layerName =='Luminarias'; }); return arrayUtils.map(filtered, function (result) { var feature = result.feature; var layerName = result.layerName; feature.attributes.layerName = layerName; if (layerName === 'Luminarias') { var template = ap_info(feature) feature.setInfoTemplate(template); } return feature; }); }); mapp.infoWindow.setFeatures([deferred]); mapp.infoWindow.show(event.mapPoint); on(document.getElementById('map'), '.clickMe:click', function(e,x) { console.log("holasdASd", event); }); });‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

RobertScheitlin__GISP · Answer

Helen,

Here is a thread that answers that. https://community.esri.com/thread/162144