Drupal → Простейший калькулятор на AHAH

17.07.2010

AHAH нужен прежде всего для создания динамических форм, когда по определённым событиям в форму добавляются/удаляются элементы. Поэтому если по хорошему, то калькулятор следовало бы писать на javascript с использованием AJAX. Но если AHAH позволяет сократить код, то почему бы и не воспользоваться им, ведь по идее "ответ" это тоже элемент формы, у него даже имя есть "answer" :)

Калькулятор в работе

Регистрируем адрес по которому будет выводится калькулятор:

/**
 * Реализация hook_menu()
 */
function simplecalc_menu()
{
    $items['calc'] = array(
        'title' => 'Simple Calc',
        'page callback' => 'drupal_get_form',
        'page arguments' => array('simplecalc_form'),
        'access arguments' => array('access content'),
        'type' => MENU_CALLBACK,
    );

    return $items;
}

Описание формы:

/**
 * Форма калькулятора
 */
function simplecalc_form()
{
    $form['wrapper'] = array(
        '#prefix' => '<div class="container-inline">',
        '#suffix' => '</div>',
    );
    
    $form['wrapper']['number1'] = array(
        '#type' => 'textfield',
        '#size' => 3,
        '#suffix' => '+',
    );
    
    $form['wrapper']['number2'] = array(
        '#type' => 'textfield',
        '#size' => 3,
    );
    
    $form['wrapper']['answer'] = array(
        '#value' => '= <div id="answer">?</div>',
    );
    
    $form['submit'] = array(
        '#type' => 'submit',
        '#value' => 'Посчитать',
        '#ahah' => array(
            'path' => 'calc/ahah', // адрес по которому будет отправлен AJAX запрос
            'wrapper' => 'answer', // id элемента в который вернёться результат AJAX запроса
        ),
    );
    
    return $form;
}

В параметре ['#ahah']['path'] указан адрес, на который будут отправлены данные формы и который должен вернуть результат, поэтому нужно зарегистрировать его в hook_menu:

...
$items['calc/ahah'] = array(
    'title' => 'Calculate',
    'page callback' => 'simplecalc_ahah',
    'access arguments' => array('access content'),
    'type' => MENU_CALLBACK,
);
...

Последний штрих, кэлбак меню, который обрабатывает форму и возвращает ответ:

/**
 * AHAH callback
 */
function simplecalc_ahah()
{
    // по хорошему, тут мы должны достать форму из кэша, добавить новый
    // элемент (поле ответ), сохранить форму в кэш, отрендерить новый элемент
    // и вернуть его html код. Подробнее по ссылкам ниже.

    $number1 = isset($_POST['number1']) ? (int)$_POST['number1'] : 0;
    $number2 = isset($_POST['number2']) ? (int)$_POST['number2'] : 0;

    drupal_json(array('status' => true, 'data' => $number1 + $number2));
}

Исходники модуля.

Ссылки по теме:

AHAH: добавление элементов в форму (eng).
Getting going with AHAH and Drupal 6.
Cooler forms with Drupal's AHAH (Asynchronous HTML and HTTP).
Простейшая реализация AHAH в Drupal.
Что такое AHAH и что он может делать?.

Замечу, что в Drupal 7 работа с AJAX упростилась и вышла на новый уровень — Простейший калькулятор на AJAX для Drupal 7.

Написанное актуально для
Drupal 6.x
Похожие записи

Комментарии

Sergey S.
05.03.2011, 07:27

Очень не хватает простых уроков по AHAH. Т.е. именно простой грамотный вывод пост-данных, без всяких приблуд типа динамического изменения формы. А то что-то туго доходит пока. :)

Спасибо за пример, кстати если не поставить 'event' => 'click', то калькулятор после ответа перегружается

$form['submit'] = array(
....
'#ahah' => array(
'event' => 'click',
...
Игорь
28.11.2012, 20:39

Здравствуйте!
В 7-ке всё просто: ajax_command_invoke($selector, $method, array $arguments = array())
6-ка уже стареет... но интересно кое что доделать:
нужен метод 'val'
здесь http://api.drupal.ru/api/file/developer/topics/forms_api_reference.html…
Написано: 'Кроме того, можно использовать любые методы операций с DOM в JQuery.'
Но как? Заранее спасибо за ответ.

Игорь
28.11.2012, 20:51

Да разумеется так попробовал, но он вставляет - [object Object]
а replace - нормально заменяет на текст -

drupal_json(array('status' => TRUE, 'data' => 'текст вставили'));

Еще есть вот такая штука ucalc.pro/help/integration/drupal не модуль конечно, но решает любую задачу по калькулятору для Drupal.

Добавить комментарий