Question

I am trying to display a ModalDialog as soon as the window gets loaded, something like a license agreement for my app. It seems to work fine when triggered with a button click, but does not work when I try this:

This is in the components array of my VFlexBox kind:

{ name: "theDialog", kind: "ModalDialog", components: [
    { content: "This is a Dialog Box" },
    { layoutKind: "HFlexLayout", pack: "center", components: [
    { name: "okayButton", kind: "Button", caption: "Okay" },
    { name: "closeButton", kind: "Button", caption: "Close" }
    ]}
]}

And this is where I’m trying to show the dialog.

create: function() {
   this.inherited(arguments);
   this.$.theDialog.openAtCenter();
}

If I placed the this.$.theDialog.openAtCenter(); inside the handler of a Button’s onclick event, it works absolutely fine.

Answer 1

Have you tried placing the this.$.theDialog.openAtCenter(); inside the rendered()

Something like this:

rendered: function() {
     this.$.theDialog.openAtCenter();
}

Since the type is “Control” rendered should be called when the UI element is created and hence openAtCenter should be called.