web-dev-qa-db-ja.com

Drupal 7でWebフォーム送信をajax化する方法は?

カスタムモジュールでhook_form_alter()hook_node_view()を使用してwebformレンダリングを変更しようとしたので、どこかに '#ajax'を追加できます。

D6またはD7でwebformおよびajaxを使用した経験がある人はいますか?ロジックはD6とD7で同じで、実装だけが変わると思います。

8

Ajaxモジュール は、Drupal 6。

Drupal 7の場合:

function mymodule_form_alter(&$form, &$form_state, $form_id) {
      // see if webform_client_form_ is in the form_id
      if(strstr($form_id, 'webform_client_form_')) {
        // get the nid so we can use it in the wrapper value
        $nid = $form['#node']->nid;
        // add the ajax properties to the submit button
        $form['actions']['submit']['#ajax'] = array(
          'callback' => 'mymodule_webform_js_submit',
          'wrapper' => 'webform-client-form-' . $nid,
          'method' => 'replace',
          'effect' => 'fade',
        );
      }
    }

function mymodule_webform_js_submit($form, $form_state) {
      // define the $sid variable (submission id from webform)
      $sid = $form_state['values']['details']['sid'];
      // if we have a sid then we know the form was properly submitted, otherwise, we'll just return the existing $form array
      if ($sid) {
        // first we have to load up the webform node object
        $node = node_load($form_state['values']['details']['nid']);
        // create an array up with the confirmation message, retreived from the webform node
        $confirmation = array(
          '#type' => 'markup',
          '#markup' => check_markup($node->webform['confirmation'], $node->webform['confirmation_format'], '', TRUE),
        );
        // return the confirmation message
        return $confirmation;
      }
      else {
        // return the form
        return $form;
      }
    }
8
Matthew Woodard

特定のフォームのみをajax化したい場合の最も簡単な方法の1つは、 jquery form plugin を追加することです。そのかなり簡単です。

以下のコードをtemplate.phpファイルのページ前処理関数に追加します。

  1. まず、以下のコードでjqueryプラグインを追加します。

    drupal_add_js(drupal_get_path( 'theme'、 'your_theme')。 "/js/jquery.form.js");

  2. 次に、以下のコードを追加し、#your_form_ID withs your form id

    drupal_add_js( '

                (function($){ 
    $(document).ready(function() { 
    
                $("#your_form_ID").ajaxForm(function() { 
                    alert("Thank you for your comment!"); 
                }); 
    });     }(jQuery));;
    
           ', 'inline');
    

これですべて完了です。必要なページだけをスクリプトにロードすることを検討したい場合があります。

0
esafwan