为drupal webform创建windows弹出窗口

时间:2013-10-09 05:38:49

标签: jquery drupal-7 drupal-webform

我已经设置了drupal webform,并尝试创建弹出窗口来输入提交。我把所有的东西放在我的自定义模块中。 我的目标是:

  • 当访问者输入电子邮件地址,然后点击加入,如果电子邮件有效 然后将数据保存到数据库中,并放在相同的弹出窗口中 访客将得到消息“感谢加入我们的计划bla bla bla“,所以我希望这个弹出窗口在提交数据后不会关闭。其他 单词,我不希望访问者被重定向到另一个页面,我想要 访客留在这个弹出窗口。
  • 当电子邮件地址无效或输入的电子邮件表单仍然为空时,在此弹出窗口中,访问者将收到消息“抱歉的电子邮件是必需的或bla bla bla”。
  • 弹出窗口不会关闭,直到访问者点击关闭按钮。

这些是我写的代码,提交的数据但它仍然是返回表单,我希望它返回确认文本。

my_module.module:

/* menu callback */

function my_module_menu() {
    $items['newsletter-popup'] = array(
        'title' => 'Join Club',
        'page callback' => 'ctools_ajax_newsletter',
        'page arguments' => array(1),
        'access callback' => TRUE,
        'type' => MENU_CALLBACK
    );

    return $items;
}

function ctools_ajax_newsletter() {
    $path = drupal_get_path('module', 'my_module');
    drupal_add_library('system', 'ui.dialog', false);
    drupal_add_library('system', 'ui.draggable', false);
    drupal_add_js($path . '/my_module.js');

    $output = '';
    $webform_nid = 1; // nid for my webform submission
    $node = node_load($webform_nid);
    $submission = (object) array();
    $webform = drupal_get_form('webform_client_form_' . $webform_nid, $node, $submission);
    $output .= '<div id="popup">';
    $output .= '<h2>Get $25 off your order</h2>';
    $output .= '<span>Sign up we\'ll give you $25 off your first order.</span>';
    $output .= drupal_render($webform);
    $output .= '<span>Limited Time Offer, One use per household</span>';
    $output .= '</div>';

    return $output;
}

function my_module_form_alter(&$form, &$form_state, $form_id) {
    if ($form_id == 'webform_client_form_' . WEBFORM_NID) {
        dpm($form_state);
        $form_state['redirect'] = 'confirmation';
        $nid = $form['#node']->nid;
        $form['actions']['submit']['#ajax'] = array(
            'callback' => 'my_module_webform_js_submit',
            'wrapper' => 'webform-client-form' . $nid,
            'method' => 'replace',
            'effect' => 'fade'
        );
    }
}

function my_module_webform_js_submit($form, $form_state) {
    $sid = $form_state['values']['details']['sid'];

    if ($sid) {
        $node = node_load($form_state['values']['details']['nid']);
        $confirmation = array(
            '#type' => 'markup',
            '#markup' => check_markup($node->webform['confirmation'], $node->webform['confirmation_format'], 'apa aja ya disini', TRUE),
        );

        return $confirmation;
    } else {
        return $form;
    }
}

my_module.js

(function($) {
    $(document).ready(function() {
        $('#popup').dialog({
            height: 'auto',
            width: 700,
            autoOpen: false,
            modal: true,
            resizable: false
        });

        $('a').click(function() {
            var status = false;
            if (this.className !== 'lightbox-processed') {
                if (!getCookie('newsletter_popup')) {
                    setCookie('newsletter_popup', 'true', 1);
                    $('#popup').dialog('open');
                } else {
                    status = true;
                }
                if (this.className === 'ui-dialog-titlebar-close ui-corner-all ui-state-hover') {
                    $('#popup').dialog('close');
                    status = true;
                } else {
//                next_location = this.href;
                }
            }
            if (this.id === 'bottomNavClose') {
                $('#popup').dialog('close');
            }
            return status;
        });
    });
})(jQuery);

就是这样,我真的需要每个人的帮助。谢谢 Yuanita。

1 个答案:

答案 0 :(得分:0)

最好使用已经构建的模块为您完成工作,而不是编写代码。你可能想看看这个,

Drupal:Display webform on a popup box