How to work with simple dialogs
How to work with dialogs started from dialogs
How to work with multi-step dialogs
How to start dialog without button
Validation

How to work with simple dialogs

Example 1

Simple Form. Accepts request and display result: (Custom form buttons,all config defined in link attributes) 
Starter:
<a href="#" 
title="Add funds" 
class="control-item-add" 
data-form-action="/scripts/controljs/examples/handle1.html" 
data-form-url="/scripts/controljs/examples/form1.html" 
data-form-options="custom_buttons">Open Form</a>
...
Dialog:
<button class='control-submit-button'>Add</button>
Open Form

Example 2

Simple Form. Accepts request and display result: (Standart form buttons,all config defined in link attributes) 
Starter:
<a title="Add funds"
class='control-item-add'
data-form-action="..."
data-form-url="...">Open Form</a>
Open Form

Example 3

Simple Form. Accepts request and display result: (Custom form buttons, action defined in form) 
Starter:
<a title="Add funds"
class="control-item-add"
data-form-url="..."
data-form-options="custom_buttons">Open Form</a>
...
Dialog:
<form action="/scripts/controljs/examples/handle1.html">
<button class='control-submit-button'>Add</button>
</form>
Open Form

Example 4 - Magic Starts

Simple Form. Accepts requests and display results: Updates .control-updatable when dialog closed. (Custom form buttons, 2 actions defined in form) 
Starter:
<a title="Add funds"
class="control-item-add"
data-form-url="..."
data-form-options="custom_buttons">Open Form </a>
...
Dialog:

<button class="control-submit-button" data-submit-action="/scripts/controljs/examples/handle1.html">Add to Privatbank</button>
<button class="control-submit-button" data-submit-action="/scripts/controljs/examples/handle2.html">Add to Oschadbank</button>
<button class="control-cancel-button">Cancel</button>
Page:
<div class="control-updatable" data-load-url="/scripts/controljs/examples/data4.php"></div>
Open Form

How to work with dialogs started from dialogs

Example 5 -

Two Forms. Accepts requests and display results: (Custom form buttons, 2 actions defined in form) 
Starter:
<a title="Add funds"
class="control-item-add"
data-form-url="..."
data-form-options="custom_buttons">Open Form </a>


Dialog 1:

<button class='btn control-item-add' data-form-url="/scripts/controljs/examples/form5-1.html" 
data-form-options="return_to_dialog,custom_buttons" title="Manage accounts">Manage accounts</button>	

<button class="control-submit-button" data-submit-action="/scripts/controljs/examples/handle1.html">Add to Privatbank</button>
<button class="control-submit-button" data-submit-action="/scripts/controljs/examples/handle2.html">Add to Oschadbank</button>
<button class="control-cancel-button">Cancel</button>

Dialog 2:

<button class="control-cancel-button">Cancel</button>
Open Form

How to work with multi-step dialogs

How to start dialog without button

It can be useful if you want start dialog on page load, some error, etc. 
	SiteControl.setOptions({
			"add_form_url": "/examples/form1.html,
			"custom_buttons": true,
			"title": "Form inited on some event",
		});
		SiteControl.startModal("add");
Enter text: