Read content of popup after opening

Question

I'm working with Arcgis version 4.27 and want to set click function for the content of the popup after opening the popup. As I understand, the best way is "reactiveUtils" but doesn't work properly and the length of the "$(".tblInfoWindow").find("img.Question")" is zero.

The code is:

reactiveUtils.watch(
() => mainView.popup.visible,
(visible) => {
if (visible) {
console.log($(".tblInfoWindow").find("img.Question").length);
$(".tblInfoWindow").find("img.Question").click(function () {
var layerID = $(this).attr("id").replace("question_layer", "");
var layerName = $.trim($(this).parent().text());

OpenQuestionLink(layerID, layerName);
});
}
}
);

How can I set click function for the content of the popup after opening that? Seems visible=true before opening the popup!

JoelBennett · Answer

The issue appears to be that just because the visible property changes to true, it doesn't mean the content has yet been added to the popup, and therefore queryable through the DOM. Since the popup doesn't have the equivalent of a "content-ready" event, we have to be a little more creative. I recommend something like the following:

new MutationObserver(function() {
	if (popup.visible) {
		var button = document.querySelector("myButtonSelector");

if ((button) && (button.dataset.addedclick != "true")) {
			button.dataset.addedclick = "true"; //flag to indicate we've set the handler, so action doesn't get repeated unnecessarily
			button.onclick = function() {
				//do something
			};
		}
	}
}).observe(popup.container, {childList:true,subtree:true});

LaurenBoyd · Answer

Hi @samitalebi -

You can try to watch when the view.popup.selectedFeature changes using reactiveUtils:

reactiveUtils.when(() => view.popup?.selectedFeature, () => {
  console.log(view.popup.selectedFeature)
});

Here is an example CodePen shows how to access that: https://codepen.io/laurenb14/pen/yLQRgGM?editors=1000

If that doesn't work, could you please send a CodePen with an example of what you are trying to achieve?