Code Directory
 Visual Basic & VB.NET
New Code
phpEnter 5.1.
Udemy Clone script 2.01
VisualNEO Web 19.11.7
VisualNEO for Windows
SentiVeillance SDK Trial 7.3
Devart ODBC Driver for PostgreSQL 3.2
SecureBridge 9.2
dotConnect for QuickBooks 1.9
dotConnect for Magento 1.9
dotConnect for Zoho CRM 1.10
dotConnect for FreshBooks 1.10
IP2Location Geolocation Database January.2020
dotConnect for BigCommerce 1.10
HTMLPad 2020 16.0
WeBuilder 2020 16.0
Top Code
SecureBridge 8.0
IP2Location Geolocation Database January.2020
ATN Site Builder 3.0
Eclipse Unicode View 1.0
Ledger Accounting for Firebird/Interbase
ICPennyBid Penny Auction Script 4.0
Java Code Checker (JCC) 1.0
Classified Ad Lister 1.0
ADO.NET Provider for ExactTarget 1.0
ATN Resume Finder 2.0
PHP Review Script 1.0
Invoice Manager by PHPJabbers 3.0
Multiplication table
Devart ODBC Driver for PostgreSQL 3.2
Aglowsoft SQL Query Tools 8.2
Top Rated
phpEnter 5.1.
Single Leg MLM 1.2.1
Azizi search engine script PHP 4.1.10
Paste phpSoftPro 1.4.1
Extreme Injector 3.7
Deals and Discounts Website Script 1.0.2
ADO.NET Provider for ExactTarget 1.0
Solid File System OS edition 5.1
Classified Ad Lister 1.0
Aglowsoft SQL Query Tools 8.2
Invoice Manager by PHPJabbers 3.0
ICPennyBid Penny Auction Script 4.0
PHP Review Script 1.0
ATN Resume Finder 2.0
ATN Site Builder 3.0
Jquery UI Dialog 6.x-1.10
File ID: 97390

Jquery UI Dialog 6.x-1.10
Download Jquery UI Dialog 6.x-1.10http://drupal.orgReport Error Link
License: Freeware
File Size: 20.5 KB
Downloads: 4
Submit Rating:
Jquery UI Dialog 6.x-1.10 Description
Description: In Short

If you are not a developer or asked to install this module as a dependency, you most probably won't have any use for it. This module enables you to use jquery ui dialog in Drupal.
Features yet implemented

* It enables you to use JQuery UI Dialog library. It also automatically creates an iframe inside the dialog you dont need to care about. This enables you loading normal Drupal pages inside (like FAPI stuff)
* Exports a simple API to open/close dialogs
o While you can use the api jquery_ui_dialog, or you can also use the JQuery UI Dialog API directly your own way, using the full power of JQuery UI Dialog(well jquery_ui_dialog does not limit it, but makes some assumptions). This is one of the main differences to modalframe
o You can also use the JQuery UI Dialog buttons to control the window.
* Integrates with the the JQuery UI theme. You can use your own theme for the dialog only (using the namespace), please refer to the docs.
* Supports autoresizing and positioning.
* Supports loading the IFrame content using POST+Data.

the WYSIWYG image upload module is implemented using jquery_ui_dialog. You can see it in action in this videocast: video-podcast
Compatibility / Dependencies
Server Dependencies

1. jquery_update: Its important uto se the 6.x-2.x-dev version ( so jquery_1.3.x ).
2. jquery_ui: The Drupal module must be version 6-x-1.3 (stable) while the jquery_ui download must be jquery_ui 1.7.x not 1.6
* Refer to this short How-To if you dont know what this is all about.

Client Browser Dependencies

- javascript

1. Download and activate the module
2. Clear the cache

Why has this module been created?

Eventhough a lot of ideas and code has been taken from the modalframe project, this project is different. The modalframe maintainer was not going to support the jquery-ui button (even with provided patches). This is a critical feature to usecases like WYSIWYG Dialogs, because you cannot provide a "similar look and feel" and creating a better usability.

In addition you cannot use the general jquery ui themes with modalframe properly, as this would interfere with projects like Tabs or other jquery ui projects. Therefore jquery_ui_dialog has its own namespace where the jquery ui theme is loaded. You can replace that theme and change the look and feel of the dialog that way. This will be a critical point for the WYSIWYG dialogs, as most of the Editors are looking different or have different color-schemas, so the should be addapted.

Finally jquery_ui_dialog has been cutted down to nearly the limit, being half of the code-size of modalframe.

While you might think "this also could have been implemented in modalframe", the maintainer was not interested in implementing those features.
Usage / API Documentation
For opening a Dialog (Parent) you need..

1. PHP side: Run the jquery_ui_dialog_parent_js(); method. It includes needed javascript and CSS files.

function wysiwyg_imageupload_form_alter(&$form, $form_state, $form_id){
if ($form['#id'] == 'node-form' ) {
$form['#submit'][] = 'wysiwyg_imageupload_form_submit';

if(strstr($form_state['post']['form_id'],'node_form')) {
2. javascript side: To open the dialog itself,;. Arguments are:
* url, [string] : the URL of the page to open. If not provided, you have to handle the loading yourself
* method, [get/post] : What method should be used to load the url, default is get
* data, [object] : Some post-DATA you can pass to the load method (if you use method=post). General format used by jQuery $.post
* autoresize, [bool] : You can turn off autoresize of the dialog using this, default is true (on)
* namespace, [string] : A class name "-dialog will be added to the main dialog wrapper and to the body of the dialog named "". Use this for dialog-specific styling. (on)
* For all the other options please refer the jquery ui dialog documentation

var btns[Drupal.t('Cancel')] = function() {

var aurl = Drupal.settings.basePath+'index.php?q=ajax/wysiwyg_imgupl/add/'+form_id;{url:aurl, buttons: btns,width:540});
Close the dialog

If you want to close the dialog from the parent, use

In the Dialog (child)

In the dialog you also need to include some javascript. It is mainly used to build up a communication tunnel between the opener (parent) and the opened dialog (child). It handles resize events and so forth.

1. PHP side: run the jquery_ui_dialog_child_js() method. It includes all needed javascript and CSS files

That method is a menu handler and it returns some upload form which is show in the dialog.
function wysiwyg_imageupload_upload_form(&$form_state,$form_id) {
module_invoke('admin_menu', 'suppress');
drupal_set_title(t('Upload image'));
$form = array();
$form['#attributes'] = array('enctype' => "multipart/form-data");
$form['image_upload'] = array(
'#type' => 'fieldset',
'#title'=> t('Upload image'),
'#prefix' => '<div id="file_upload_group">',
'#suffix' => '</div>');

return $form;
2. javascript side: Nothing


Implement this hook if you want to change something when the child dialog is loaded, e.g. included some special CSS files or change the page template and so forth.
CSS styling

The body in the child has the id 'jquery_ui_dialog". You can use this to set "dialog specific styles" if you like to.

When you call the jquery_ui_dialog_child_js() method the jquery_ui_dialog implementation cares about using a stripped down page.tpl which does not show your site-layout. Nevertheless it loads all the javascript and CSS defintions in the page, so you still see the elements designed your way. So this helps you to put your work into designing the dialog only, not removing the layout everytime.

If you dont understand the documentation or think, there is something important missing, or you have written a howto i might should link here, just let me know and open an support issue. Thanks.
Contributions / Issues

Contributions are highly respected, also feedback on issues or patches.
Feature requests

Please don't hassle with feature request, but please think about them properly, before you file in a issue-ticket. Please provide a basic outline of what the goal or the benefit of this feature would be. Outline the group of user you think is interested in.

Implement them! :)
Similar modules

* Dialog:Also a jquery ui dialog implementation. Very slim - does not support iframes / jquery ui themes (namespaced)
* Floating Window Looks like a very slim integration (not iframe). Promising.
* Modalframe: Also a jquery ui dialog implementation. Has quiet a long history and some contrib modules using it.
* Popups API
* Colorbox: Implementation of colorbox, could be promising (but buttons missing)
* Thickbox
* Lightbox2

This plugin was sponsored by KontextWork GbR for the enterprise Wiki based on Drupal called Drupal Wiki

If you like the module, please write a comment here to motivate people working on it!

License: Freeware

Related: Dialog, jquery, Module, method, vascript, jquery dialog, Theme, modalframe, drupal, Wysiwyg, Buttons, Child, Namespace, Support

O/S:BSD, Linux, Solaris, Mac OS X

File Size: 20.5 KB

Downloads: 4

More Similar Code

This module provides an API to render an iframe within a modal dialog based on the jQuery UI Dialog plugin. You should not install this module unless another module requires you to, or you wish to use it for your own custom modules.

It is an alternative to Popups API (Ajax Dialogs) which implements its own library and API to manage popup dialogs. On the other hand, the Modal Frame API is based on the jQuery UI Dialog plugin and it...

The module provides an API for creating and updating javascript dialog windows using the jQuery UI Dialog widget and the CTools ajax framework.
Core module support

The module also supplies several sub-modules that provide dialogs...

The tabs module integrates the jQuery UI tabs plugin, providing client-side interactive tabs. This is a helper module. It doesn't do anything on its own. Rather, it is used by other modules that provide tabs.

Formerly part of the...

Extends jQuery UI's datepicker (calendar) allowing multiple dates and range selection and avoidance.

A simple layout manager for jquery UI

Theme switcher tool for the jQuery UI CSS Framework.

Change the css stylesheet using an jQuery UI dialogbox which you can call using a button or a link in your html page. Completely implemented in your webspace.

UI::Dialog is a Object Oriented Perl wrapper for the various dialog applications. These dialog backends are currently supported: Zenity, XDialog, GDialog, KDialog, CDialog, and Whiptail.

jQuery UI .NET project is Web User Controls suite that wraps standard jQuery UI widgets, e.g. Accordion, Tabs, Button, etc. The project aimed to ease integration of jQuery UI with ASP.NET.
The current (initial) version is based on jQuery UI...


This module includes the jquery ui multiselect plugin.
Get involved

* Write a review for this module on drupal modules
* Help write or improve the documentation.

This plugin brings jQuery, jQuery UI and jQuery Tools to your site. It supports grabbing the libraries from both Content Delivery Networks (CDNs) and local copies, allows to activate jQuery.noColflict() mode if necessary. As well it already...

User Review for Jquery UI Dialog
- required fields

Please enter text on the image