function ctools_modal_add_js in Chaos Tool Suite (ctools) 7

Same name and namespace in other branches

1. 6 includes/modal.inc \ctools_modal_add_js()

@file Implement a modal form using AJAX.

The modal form is implemented primarily from mc.js; this contains the Drupal specific stuff to use it. The modal is fairly generic and can be activated mostly by setting up the right classes, but if you are using the modal you must include links to the images in settings, because the javascript does not inherently know where the images are.

You can accomplish this with this PHP code: @code { ctools_include('modal'); ctools_modal_add_js(); }

You can have links and buttons bound to use the modal by adding the class ctools-use-modal.

For links, the href of the link will be the destination, with any appearance of /nojs/ converted to /ajax/.

For submit buttons, however, the URL is found a different, slightly more complex way. The ID of the item is taken and -url is appended to it to derive a class name. Then, all form elements that contain that class name are founded and their values put together to form a URL.

For example, let's say you have an 'add' button, and it has a select form item that tells your system what widget it is adding. If the id of the add button is edit-add, you would place a hidden input with the base of your URL in the form and give it a class of 'edit-add-url'. You would then add 'edit-add-url' as a class to the select widget allowing you to convert this value to the form without posting.

If no URL is found, the action of the form will be used and the entire form posted to it.

5 calls to ctools_modal_add_js()

ctools_access_admin_render_table in includes/context-access-admin.inc

Render the table. This is used both to render it initially and to rerender it upon ajax response.

ctools_ajax_sample_page in ctools_ajax_sample/ctools_ajax_sample.module

Page callback to display links and render a container for AJAX stuff.

ctools_context_admin_includes in includes/context-admin.inc

Include all context administrative include files, css, javascript.

template_preprocess_page_manager_edit_page in page_manager/theme/page_manager.theme.inc

Preprocess the page manager edit page.

theme_page_manager_page_form_argument_table in page_manager/plugins/tasks/page.admin.inc

Theme the table for this form.

File

includes/modal.inc, line 41

Implement a modal form using AJAX.

Code

function ctools_modal_add_js() {

  // Provide a gate so we only do this once.
  static $done = FALSE;
  if ($done) {
    return;
  }
  $settings = array(
    'CToolsModal' => array(
      'loadingText' => t('Loading...'),
      'closeText' => t('Close Window'),
      'closeImage' => theme('image', array(
        'path' => ctools_image_path('icon-close-window.png'),
        'title' => t('Close window'),
        'alt' => t('Close window'),
      )),
      'throbber' => theme('image', array(
        'path' => ctools_image_path('throbber.gif'),
        'title' => t('Loading...'),
        'alt' => t('Loading'),
      )),
    ),
  );
  drupal_add_js($settings, 'setting');
  drupal_add_library('system', 'jquery.form');
  drupal_add_library('system', 'drupal.progress');
  drupal_add_library('system', 'drupal.ajax');
  drupal_add_library('system', 'ui');
  ctools_add_js('modal');
  ctools_add_css('modal');
  $done = TRUE;
}