Plugin Dialog
Introduced with Tiki8
Use this wiki plugin to create a custom pop-up dialog box using jQuery UI.
Parameters
Create a custom popup dialog boxIntroduced in Tiki 8. Required parameters are in
bold.Go to the source code
Preferences required: wikiplugin_dialog
| Parameters | Accepted Values | Description | Default | Since |
|---|---|---|---|---|
| (body of plugin) | Array | |||
buttons |
text | Use comma-separated values for multiple buttons | 8.0 | |
size |
sm md lg xl fullscreen |
Size of the modal dialog. Default is medium | md | 28.0 |
wiki |
pagename | Wiki page to use as dialog body | 8.0 | |
buttonsActions |
text | JavaScript to perform on button click. Use comma-separated values for multiple buttons | 28.0 | |
buttonsClassNames |
text | Css class names to apply to the buttons. Use comma-separated values for multiple buttons. | 28.0 | |
title |
text | 8.0 | ||
actions |
text | JavaScript to perform on button click. Use comma-separated values for multiple buttons | 8.0 | |
id |
text | Allowing to control the modal via JS. Automatically generated if left empty in the form (it has to be unique) | 8.0 | |
openAction |
rawhtml_unsafe | JavaScript callback function to execute when dialog opens. | 8.0 | |
staticBackdrop |
y n |
If true, the modal will not close when clicking outside of the modal | n | 28.0 |
autoOpen |
(blank) y n |
Open the modal automatically | n | 8.0 |
showAnim |
y n |
Allow the modal to open with a fade in effect | y | 8.0 |
showCloseIcon |
y n |
Show a close icon in the header of the modal | y | 28.0 |
useWikiContent |
y n |
Use wiki page content as the dialog body | n | 28.0 |
Example
This code will cause a pop-up dialog box to appear when this page is loaded:
Plugin
Copy to clipboard
{DIALOG(title="World hello Dialog!" buttons="Foo,Bar" actions="alert(\"foo clicked\"),alert(\"you cancelled\")" showAnim="blind" hideAnim="explode" autoOpen="y" modal="y" wiki="plugin dialog test body" openAction="testDialog(this);")}Hello World{DIALOG}
Example with smarty template
The following code will cause a popup dialog window.
Put this in at the end of your template file:
sample.tpl
Copy to clipboard
{wikiplugin _name="DIALOG" autoOpen="n" id="wpdialog_bobshop_shipping" title="Shipping Costs" modal="y" wiki="bobshop_shipping"}{/wikiplugin}
Don't forget the underscore "_" before the parameter "_name".
Place this code in your template file at the place you want:
sample.tpl
Copy to clipboard
<p onClick='javascript:$( "#wpdialog_bobshop_shipping" ).dialog( "open" );'>Shipping</p>
In this example there must be a wikipage called "bobshop_shipping". Feel free to create it.
More info for params "hideAnim" and "showAdnim"
More option for the show and hide animations can be found here.