Expand my Community achievements bar.

Dialog-Ready event does not fire on smaller breakpoints

Avatar

Level 4

I see much use of attaching to the "dialog-ready" event when adding custom javascript in a dialog.

This is fine and dandy when the dialog appears in modal form. When you click the edit button on a component when on a smaller breakpoint, the browser loads that particular dialog with a page refresh and the "dialog-ready" event is never fired, so any code bound to that will not be fired.

I have switched over to using the 'extraClientLibs' property on the dialog node itself. This kind of works, but when this javascript fires in non-modal mode it fires before any HTML has been loaded so that's not working 100% correctly either.

Is there a better event to bind to? Is there a more complete list of events and when they are triggered in the browsers of granite/coral lifecycle?

1 Reply

Avatar

Level 1

Is there any fix for this yet? Or an event we should be listening to when the dialog opens at "/mnt/override/"?  This is very frustrating and another reason I dislike working with closed systems.

The problem:
- 'dialog-ready' fires as expected when it's launched as a dialog in 'editor.html'

- 'dialog-ready' never fires when you are forced into "/mnt/override" on smaller screens. Why does this even happen to begin with? Why didn't you guys just program the dialog to always open and if on a smaller viewport default to fullscreen? Is there anyway to set this behavior? I'm going to have to do a window.load event to get around this.
 

// Only way I could get around this horrible API design pattern if (location.href.match(/mnt\/override/)) $(window).on('load', onReadyFunction) else $(document).on('dialog-ready', onReadyFunction)


---

Edit: $(document).on('foundation-contentloaded') seems to be the right event to listen to