web-dev-qa-db-ja.com

マルチステップ登録フォーム

ドキュメントとAPIをグーグルで読みながら、2つのフォームを1つに「結合」して複数ステップのフォームを作成するための複数のソリューションを見てきました。

私が欲しいのは、それが可能かどうかはわかりませんが、私の(巨大な)ユーザー登録フォームを2つのステップに「分割」することです。ステップ2。

登録フォーム全体をドロップしてコードまたは別の方法で再作成し、どういうわけかユーザー登録プロセス全体を再実装したくありません。それは可能ですか?

編集:誤解を避けるために、私がしなければならないことは、「実際の」マルチステップフォームであり、ステップ間にサブミットがあり、フロントエンドの処理ではありません。つまり、すべてをJavaScriptに依存しないようにしたいのです。

EDIT2:さらに明確にするために、タスクは、「編集」フォームを2つの部分に大部分を分割する方法/可能な場合を理解することです。現在の質問では、ユーザー/編集および/またはユーザー/登録フォームについて具体的に尋ねていますが、より一般的なソリューションを考え出すために、ノード/編集フォームを2つの部分に分割することもできます。それは私が本当に求めていることです。エンティティ/編集フォームを2つ以上のステップに分割します。

5
magtak

これを行う1つの方法は、 Conditional Fields モジュールを使用することです(免責事項:D7の生産の準備ができていないとして記載されています)。独自のコードでそれを行う方法は、 States API を使用することです(条件付きフィールドモジュールは、基本的には、状態APIへの単なるGUIです)。

条件付きフィールドを使用して、たとえば、フィールドAに選択された値に基づいて、要件に従っていくつかのフィールドが表示または非表示になるように設定できます。

[〜#〜] edit [〜#〜]:フォームを2つのステップに分割するには、 フィールドグループ を使用できます。 =「マルチページステップ」機能を提供するモジュール。これを設定するには、ユーザー登録フォームに含める各ページのタイプmultipageのフィールドグループを作成し、各ページの下に適切なフィールドを配置する必要があります(ユーザーアカウント管理フィールド画面)。

注:JavaScriptが無効になっている場合、条件付きフィールドおよびフィールドグループモジュールはすべてを1つの巨大なページとして表示します。私はこれを回避する方法を知りません。

3
Patrick Kenny

Profile2 モジュールを見てください。最初に遭遇したとき、私はその目的と18k +サイトがそれがそれほど有用であると思った理由について少し混乱していました:-p各ユーザーに関連付けられた多くのフィールドがある場合、ユーザー情報の保存と整理に最適です。

Profile2モジュールは、ユーザーアカウントに関連付けられた新しいプロファイルエンティティを作成および維持します。未開始の場合、Drupal 7では、エンティティは通常、フィールドが添付された情報のセットです。ノードはエンティティ、ユーザーはエンティティ、関係はエンティティなどです。プロファイルエンティティは新しいノードと同様に動作します、ただしユーザーアカウントに関連付けられている場合を除きます。ユーザーは、実際のアカウントページとは別のページで、またはアカウントページ自体の一部として(選択した設定に応じて)プロファイルを編集できます。

あなたのプロジェクトのために、これが私がお勧めするものです:

  1. Profile2をインストールして有効にします。これにより、新しいデフォルトの「メイン」プロファイルが自動的に作成されます。

  2. admin/structure/profiles/manage/mainで「メイン」プロファイルの設定を編集します。 「ユーザーアカウント登録時に表示」のチェックを外し、「プロファイルを編集するための別のページを提供する」にチェックを入れます。

  3. admin/structure/profiles/manage/main/fieldsに必要な追加のユーザーフィールドを追加します。 1つのページに保存および編集する必要のあるフィールドがまだある場合は、admin/structure/profiles/addに追加のプロファイルタイプを作成するか、または フィールドグループ (JavaScriptベース)を使用してフォームをグループ。

  4. ルールをインストールして有効にします。新しいユーザーアカウントをプロファイル編集ページに転送するルールを作成します:profile-main/[account:uid]/edit。フォームをさらに分解するために追加のプロファイルが必要な場合は、「新しいプロファイルを保存した後」のイベントに反応して、それらのページにユーザーを誘導する追加のルールを追加します。

ルールエクスポートコード:

{ "rules_direct_new_accounts_to_profile_edit_page" : {
    "LABEL" : "Direct new accounts to profile edit page",
    "PLUGIN" : "reaction rule",
    "REQUIRES" : [ "rules" ],
    "ON" : [ "user_insert" ],
    "DO" : [ { "redirect" : { "url" : "profile-main\/[account:uid]\/edit" } } ]
  }
}

これには、ユーザーに関する情報(プロファイルフィールド)からアカウント設定(電子メール、ユーザー名、パスワード)を分離できるという利点があります。この構成を使用すると、コードを記述せずに、目的のマルチステップユーザー登録フォームを実現できます。注意すべき唯一の注意点は、ユーザーがプロファイルを作成せずにアカウントを作成した後、ワークフローを離れることができることです(ルールによって自動的にプロファイル編集ページに誘導されますが、他の部分へのリンクをクリックできないわけではありません)サイト)。ユーザーがサイトの残りの部分を使用する前にプロファイルを完成させる必要があるために、追加のルールが必要になる場合があります。

2
thirdender

here が見つかったChaos Toolsフォームウィザードの実装を調べましたか。これらの手順に従い、複数のフォーム2にもいくつかのprofile2フィールドを統合して、登録フォームに対して同様のことを行いました。ページコールバックがあり、フォームフィールドも処理するカスタムモジュールを作成する必要がありました。これがあなたがたどりたい道であるなら、私がそれをどのように処理したかについてさらに詳しく知ることができます。

2
LWal

ここでは、実際に機能する場合と機能しない場合がある「実際の」マルチステップフォームを追加するための、まったく異なるアプローチを示します。作成したサイトで次のようなことをしました。

このサイトでは、ユーザーには4つの可能な役割がありました。すべて4、なし、またはロールAとBではなく、CとDなどではなく、ロールの任意の組み合わせを持つことができます。各ロールには、そのロールのユーザーにのみ表示される独自の関連するプロファイルフィールドのセットがあります。

ユーザー登録フォームで、ユーザーがチェックボックスで自分の役割を選択できるようにしました。次に、Rulesモジュールを使用して、アカウント登録時のロールを各ユーザーに付与しました。また、ルールを使用して、アカウントの登録時に各ユーザーのノードのセットを自動的に作成しました。これらのノードは、各役割のプロフィールの質問を含む特別なコンテンツタイプです。それらはRelationモジュールを介してユーザーアカウントにリンクされます。

次に、一連のビューを作成し、Panelsモジュールを使用してユーザープロファイルをレイアウトしました。これにより、ユーザープロファイルページのロールのさまざまなノードのフィールドが表示されます。これは非常に複雑な設定でしたが、ユーザーにプロファイルのさまざまな部分への個別の編集リンクを提供し、適切な役割を持つユーザーのみがプロファイルの特定の部分に入力するよう求められ、Javascriptなしで機能するようにします。

1
Patrick Kenny

私はDrupalから始めて、似たようなものに取り組んでいますが、実際には追求していません。ワークフローモジュールを使用して、(ワークフロー)フィールドを別のビューにリンクするための登録フォーム。データに問題がある可能性がありますが、必要なのは登録状態をいじる(それを宣伝する)ことだけであると考えていました。これは全体として機能しますが、可能な解決策としてこれを検討する必要があると思います。

0
Paulo

a。マルチステップノードフォームの場合は、msnfを使用します。それはうまくいきます! b。マルチステップ(サーバー側)ユーザー登録を作成するために、自分のニーズに合うモジュールが見つからなかったので、自分で作成する必要がありました。これが私がしたことです:

私のセットアップ:email_registration + ife + asaf

/**
 * Implements hook_form_FORM_ID_alter().
 */
function custom_form_user_register_form_alter(&$form, &$form_state, $form_id) {
    // initialize step
  if (empty($form_state['step'])) {
    $form_state['step'] = 1;
  }

    // adjust form for step 1
  if ($form_state['step'] == 1) {
        // hide default submit button
    $form['actions']['submit']['#access'] = FALSE;
        // add custom button
    $form['actions']['next'] = [
      '#value' => 'Next step',
      '#type' => 'submit',
      '#validate' => [
                // step 1 validation callback
        '_custom_user_register_form_step1_validate',
                // only if you use ife
        'ife_form_validator'
      ],
            // step 1 submit callback
      '#submit' => ['_custom_user_register_form_step1_submit'],
            // limit validation only for fields below
      '#limit_validation_errors' => [
                // add all fields that should be validated in step 1
        ['field_phone'],
        ['mail'],
      ],
    ];

        // hide all fields that belong to step 2
    $form['field_age']['#access'] = FALSE;
  } else if ($form_state['step'] == 2) {
        // hide fields that belong to step 1
    $form['field_phone']['#access'] = FALSE;
    $form['account']['#access'] = FALSE;
        // limit validation only for fields below
    $form['actions']['submit']['#limit_validation_errors'] = array(
            // add all fields in step 2
      array('field_age'),
    );

        // add custom validation callback for step 2
    $form['#validate'][] = '_custom_user_register_form_step2_validate';
        // only if you use ife
    $form['actions']['submit']['#validate'][] = 'ife_form_validator';

        // add custom submit
    array_unshift($form['#submit'], '_custom_user_register_form_step2_submit');
  }
}

とコールバック:

function _custom_user_register_form_step1_validate(&$form, &$form_state) {
  // validate here
}

function _custom_user_register_form_step1_submit(&$form, &$form_state) {
  // increase step
  $form_state['step'] = 2;
  // store step 1 values for later use
  $form_state['storage'] = $form_state['values'];
  // rebuild form
  $form_state['rebuild'] = TRUE;
}

function _custom_user_register_form_step2_validate(&$form, &$form_state) {
  // validate here
}

function _custom_user_register_form_step2_submit(&$form, &$form_state) {
  // add values from $form_state['storage'] to $form_state['values'] 
}
0
Trudog