Alloy UI

aui-dialog  1.0.1

 
Filters

Class Dialog - extends Panel

A base class for Dialog, providing:
  • Widget Lifecycle (initializer, renderUI, bindUI, syncUI, destructor)
  • Emulate the behavior of an dialog window using a floating, draggable HTML element
  • Interface for easily gathering information from the user without leaving the underlying page context
  • Using the IOPlugin, supports the submission of form data either through an XMLHttpRequest, through a normal form submission, or through a fully script-based response
Quick Example:
var instance = new A.Dialog({
bodyContent: 'Dialog body',
centered: true,
constrain2view: true,
destroyOnClose: true,
draggable: true,
height: 250,
resizable: false,
stack: true,
title: 'Dialog title',
width: 500
}).render();
Check the list of Configuration Attributes available for Dialog.

Constructor

Dialog ( config )
Parameters:
config <Object> Object literal specifying widget configuration properties.

Properties

Dialog.ATTRS - static Object

Static property used to define the default attribute configuration for the Dialog.

Dialog.NAME - static String

Static property provides a string to identify the class.

Properties inherited from Attribute:

Properties inherited from Component:

Properties inherited from Base:

Properties inherited from WidgetStdMod:

Properties inherited from Panel:

Configuration Attributes

bodyContent - Node | String

Default Value: HTMLTextNode

buttons - Array

Array of object literals, each containing a set of properties defining a button to be appended into the Dialog's footer. Each button object in the buttons array can have two properties:

text:
The text that will display on the face of the button. The text can include HTML, as long as it is compliant with HTML Button specifications.
handler:
A reference to a function that should fire when the button is clicked. (In this case scope of this function is always its Dialog instance.)
Default Value: []

close - boolean

If true the close icon will be displayed on the Dialog header.
Default Value: true

constrain2view - Object

Will attempt to constrain the dialog to the boundaries of the viewport region.

destroyOnClose - boolean

Invoke the destroy method when the dialog is closed (i.e., remove the Dialog boundingBox from the body, purge events etc).
Default Value: false

draggable - boolean

Boolean specifying if the Panel should be draggable.
Default Value: true

dragInstance - A.DD.Drag

Stores the Drag instance for the A.DD.Drag used by this Dialog.
Default Value: null

modal - boolean

True if the Panel should be displayed in a modal fashion, automatically creating a transparent mask over the document that will not be removed until the Dialog is dismissed. Uses OverlayMask.
Default Value: false

resizable - boolean

Boolean specifying if the Panel should be resizable.
Default Value: true

resizableInstance - Resize

Stores the Drag instance for the Resize used by this Dialog.
Default Value: null

stack - boolean

If true give stacking habilities to the Dialog.
Default Value: true

Configuration attributes inherited from Widget:

Configuration attributes inherited from Base:

Configuration attributes inherited from Component:

Configuration attributes inherited from WidgetStdMod:

Configuration attributes inherited from Panel:

Methods

protected void ( event )
Fires after the value of the constrain2view attribute change.
Parameters:
event <EventFacade>

_afterRenderer

protected void _afterRenderer ( event )
Fires after the render phase. Invoke _initButtons.
Parameters:
event <EventFacade>

_afterSetVisible

protected void _afterSetVisible ( event )
Fires after the value of the visible attribute change.
Parameters:
event <EventFacade>

_handleEvent

protected void _handleEvent ( event )
Handles the close event logic.
Parameters:
event <EventFacade> close event facade

_initButtons

protected void _initButtons ( )
Render the buttons on the footer of the Dialog.

_setConstrain2view

protected Object _setConstrain2view ( value )
Setter for the constrain2view attributte. Plugs or unplugs the DDConstrained plugin on the drag instance.
Parameters:
value <Object> Object to be passed to the A.DD.Drag constructor.

_setDraggable

protected Object _setDraggable ( value )
Setter for the draggable attributte. Initialize the A.DD.Drag on the Dialog.
Parameters:
value <Object> Object to be passed to the A.DD.Drag constructor.

_setModal

protected boolean _setModal ( value )
Setter for the modal attribute.
Parameters:
value <boolean>

_setResizable

protected boolean _setResizable ( value )
Setter for the resizable attribute.
Parameters:
value <boolean>

_setStack

protected boolean _setStack ( value )
Setter for the stack attribute.
Parameters:
value <boolean>

bindUI

protected void bindUI ( )
Bind the events on the Dialog UI. Lifecycle.

close

void close ( )
Fires the close event to close the Dialog.

destructor

protected void destructor ( )
Descructor lifecycle implementation for the Dialog class. Purges events attached to the node (and all child nodes).

initializer

protected void initializer ( )
Construction logic executed during Dialog instantiation. Lifecycle.

Methods inherited from Plugin.Host:

Events

bodyContentChange

bodyContentChange ( event )
Fires when the value for the configuration attribute 'bodyContent' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

buttonsChange

buttonsChange ( event )
Fires when the value for the configuration attribute 'buttons' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

closeChange

closeChange ( event )
Fires when the value for the configuration attribute 'close' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

constrain2viewChange

constrain2viewChange ( event )
Fires when the value for the configuration attribute 'constrain2view' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

destroyOnCloseChange

destroyOnCloseChange ( event )
Fires when the value for the configuration attribute 'destroyOnClose' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

draggableChange

draggableChange ( event )
Fires when the value for the configuration attribute 'draggable' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

dragInstanceChange

dragInstanceChange ( event )
Fires when the value for the configuration attribute 'dragInstance' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

modalChange

modalChange ( event )
Fires when the value for the configuration attribute 'modal' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

resizableChange

resizableChange ( event )
Fires when the value for the configuration attribute 'resizable' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

resizableInstanceChange

resizableInstanceChange ( event )
Fires when the value for the configuration attribute 'resizableInstance' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

stackChange

stackChange ( event )
Fires when the value for the configuration attribute 'stack' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set