Сегодня мы поговорим о том, как вывести в попапе форму, создаваемую модулем Webform. Выводить ее мы будем с помощью Ctools modal API, более подробно я уже писал о нем в своем уроке Ctools modal API. Работа с модальными окнами.
Шаг 1. Создаем страницу, на которую будет посылаться ajax запрос:
/**
* Implements hook_menu().
*/
function example_menu() {
$items = array();
$items['example/%ctools_js/%node'] = array(
'page callback' => 'example_page_ajax',
'page arguments' => array(1, 2),
'access callback' => '_example_node_access',
'access arguments' => array(2),
'delivery callback' => 'ajax_deliver',
'theme callback' => 'ajax_base_page_theme',
'type' => MENU_CALLBACK,
);
return $items;
}
/**
* Determines whether the current user may perform the operation on the node.
*
* @param $node
* The node object on which the operation is to be performed.
*
* @return bool
* TRUE if the operation may be performed, FALSE otherwise.
*/
function _example_node_access($node) {
if (!is_object($node) || $node->type != 'webform') {
return FALSE;
}
return node_access('view', $node);
}
/*
* Show webform in popup.
*/
function example_page_ajax($js = NULL, $node) {
if (!$js) {
drupal_goto('node/' . $node->nid);
}
ctools_include('modal');
$submission = (object) array();
$form_state = array(
'title' => $node->title,
'ajax' => TRUE,
'build_info' => array(
'args' => array($node, $submission),
),
);
$commands = ctools_modal_form_wrapper('webform_client_form_' . $node->nid, $form_state);
if (!empty($form_state['executed'])) {
ctools_include('ajax');
$commands = array();
$commands[] = ctools_ajax_command_redirect('node/' . $node->nid . '/done');
}
return array('#type' => 'ajax', '#commands' => $commands);
}
Шаг 2. Создаем служебную функцию, которая будет подключать все библиотеки, необходимые для работы попапа:
/**
* Add js and css files.
*/
function _example_include_modal() {
static $added = FALSE;
if (!$added) {
// Подключаем библиотеки только один раз.
$added = TRUE;
// Подключаем библиотеки.
ctools_include('modal');
ctools_include('ajax');
ctools_modal_add_js();
// Создаем массив с настройками для модального окна.
$script = array(
'example' => array(
'modalSize' => array(
'type' => 'fixed',
'width' => 480,
'height' => 'auto',
'contentRight' => 30,
'contentBottom' => 0,
),
'modalOptions' => array(
'opacity' => (float) 0.4,
'background-color' => '#000000',
),
'closeText' => '',
'animation' => 'fadeIn',
'animationSpeed' => 'fast',
),
);
drupal_add_js($script, 'setting');
}
}
Шаг 3. Подключаем библиотеки:
/**
* Implements hook_init().
*/
function example_init() {
// Подключаем библиотеки только на главной странице.
if (drupal_is_front_page()) {
_example_include_modal();
}
}
Шаг 4. Выводим ссылку, клик по которой открывает попап. В нужном месте вставляем следующий код:
<a class="ctools-modal-example ctools-use-modal" href="/example/nojs/node_id">Открой меня!</a>
Вот и все. Хочу обратить внимание, что библиотеки мы подключили только на главной, поэтому на других страницах попап работать не будет.