foundation-contentloaded and dialog-ready event listers fired before touch dialog loads all content - AEM 6.4

[Anderson_Hamer]

I am doing some custom field level validation in touch UI. I can see the dialog-ready and 

foundation-contentloaded event fires before the dialog content is fully loaded which gives me empty value.

I would want to know, Is there any event listener that i can use for triggering a call after my dialog is fully loaded with all widgets and its values. 

(function(document, $) {
"use strict";

$(document).on("change", ".nutri-info-content", function(e) {
var val = $(".nutri-info-dropdown").val();  // This works 
if (val == "abc") {
$('.nutri-info-field').parent().hide();
} 

});

$(document).on("foundation-contentloaded", function(e) {
    var val = $(".nutri-info-dropdown").val(); // Value is not coming. facing same problem even with dialog-ready event. 
    if (val == "abc") {
    $('.nutri-info-field').parent().hide();
    }
});

})(document, Granite.$);

[Kiran_Vedantam]

Hi @Anderson_Hamer,

You can use dialog-ready for code to trigger once the dialog is fully loaded and dialog-closed to trigger a code once the dialog is closed.

Check the code in the question in the below URL:

https://stackoverflow.com/questions/49779675/dialog-ready-event-does-not-fire-when-dialog-opens-in-a...

Hope this helps!

Thanks,

Kiran Vedantam.

[Anderson_Hamer]

Kiran Vedantam, No , I tried with dialog-ready but it is not giving me the value. The variable "val" is coming as empty

[arunpatidar · Accepted solution]

The events do work, could you please share your dialog xml? 

(function(document, $) {
"use strict";
$(document).on("foundation-contentloaded", function(e) {
var item = $(".nutri-info-dropdown").val(); // Value is not coming. facing same problem even with dialog-ready event.
console.log(item);
});

$(document).on("change", ".nutri-info-dropdown", function(e) {
var item = $(".nutri-info-dropdown").val(); // This works
console.log(item);
});
})(document, Granite.$);

[gregl22845941]

The OP is right, the foundation-contentloaded event fires before the form fields are assigned their values, the event should fire only after the javascript is done assigning the values to all the dialog fields.

[henryk87]

It's even more strange: Apparently there are multiple locations where foundation-contentloaded gets triggered. It doesn't only trigger for dialogs. Some examples:

* When clicking add / remove item on a multifield, the foundation-contentloaded gets triggered for the multifield

* When loading editor.html, I also see foundation-contentloaded get triggered multiple times, on document and also once for a random div.

There seems to be no real consistency in this; I.e. there is no nice way to handle dialog load in a simple way.