Expand my Community achievements bar.

Learn about Edge Delivery Services in upcoming GEM session
SOLVED

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

Avatar

Level 4

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.$);

 

 
Topics

Topics help categorize Community content and increase your ability to discover relevant content.

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

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.$);

 

 



Arun Patidar

View solution in original post

5 Replies

Avatar

Community Advisor

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.

Avatar

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

Avatar

Correct answer by
Community Advisor

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.$);

 

 



Arun Patidar

Avatar

Level 1

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.

Avatar

Level 1

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.