Dialog Vs Design Dialog in CQ5

In this post, I will explain dialogs and design dialogs in details. When we talk about dialogs then first question comes in our mind is 
 
What are dialog and design dialogs in CQ & why we should use them?
Dialogs & Design Dialogs are the collection of widgets used to get input from author. these are the key elements of a component as they provides a way of interaction between author and a CQ5 component. It means values inserted via author in these dialog, works as input for a component in CQ5.

Note : “Design dialogs are special kind of dialog those are available only at page design mode”.

Next question comes in our mind is – 

Difference between dialog and design dialog?
Some Differences between these two are listed below-
1). Availability
dialog are available to an author in edit mode of the page while design dialog are available to an author only at page design mode.

2). Naming Convention
For creating a dialog you have to create a cq:Dialog node with name dialog but for creating a design dialog you have to create a cq:Dialog node with name design_dialog.

3). Value Storage
If you want to save the values of widget of a Dialog or Design Dialog then you have to specify
“./<property name>” ex. ./title Here
“./”  : Represent the location of the current component. 

For Dialogs 
dialog values are stored under pages jcr:content node, located under /content directory.
The values of ./<property name> will be stored at 

/content/page/jcr:content/par/<component node> or
/content/page/jcr:content/<component node>

as a key value pair & if you define ./<dummy node>/<property name> then First <dummy node> will be created under component node and then property will be stored under that newly created <dummy node> node, so that new location becomes 

/content/page/jcr:content/par/<component node>/<dummy Node> or
/content/page/jcr:content/<component node>/<dummy Node>

may be you drop you component under a parsys or you directly include it to the page component JSP then it will be available directly under jcr:content node.

For design dialog
Design dialog values are stored under design page located under /etc/design directory. If you set the a template level property named as cq:desingPath pointing to design page ex. /etc/design/geometrixx, then all the design dialog property will be stored at 

/etc/design/geometrixx/jcr:content/<ComponentName>/par/<component> or
/etc/design/geometrixx/jcr:content/<ComponentName>/<component>

Here 
<ComponentName> refer to the component to which your template points ex. PageContent. &
<Component> refer to the component whose values are to be stored at this location. 
ex. title component, text component etc.
may be you drop you component under a parsys or you directly include it to the page component JSP then it will be available directly under jcr:content node.

if you don’t define cq:desingPath property then default location for design properties will be selected i.e. it uses default design page under /etc/design directory. New location becomes 

/etc/design/default/jcr:content/<ComponentName>/par/<component> or
/etc/design/default/jcr:content/<ComponentName>/<component>.

./<dummy node>/<property node> this case will be treated similar to a dialog property. i.e. it will create a <dummy node> & then save the properties values so that new location becomes

/etc/design/default/jcr:content/<ComponentName>/par/<component>/<dummy Node> or 
/etc/design/default/jcr:content/<ComponentName>/<component>/<dummy Node> 

4). Accessing Values in CQ5 JSPs
the value of dialog are accessible via properties object & a design dialog properties are accessed using currentStyle object

 

Happy Coding
Namah Shivay