0

多段階登録フォームを作成しています。そのために、次のようにフォームタグ内の各ステップの次のステップボタンを使用してdivを作成しました...

<form action="" method="POST">
<div class="registration_step_1 clearfix">
 /*few form fields here such as username, password etc.*/

  /*Button to proceed to next step*/
  <button class="redBtn right_part step_btn">Next</button>
</div>

<div class="registration_step_2 clearfix">
 /*few form fields here such as username, password etc.*/

  /*Button to proceed to next step*/
  <button class="redBtn right_part step_btn">Next</button>
</div>

<div class="registration_step_3 clearfix">
 /*few form fields here such as username, password etc.*/

  /*Button to proceed to next step*/
  <button class="redBtn right_part step_btn">Next</button>
</div>


<div class="registration_step_4 clearfix">
 /*few form fields here such as username, password etc.*/

  /*Button to proceed to next step*/
  <button class="redBtn right_part step_btn">Next</button>
</div>

<div class="registration_step_final clearfix">
<input type="submit" value="Register" class="redBtn round-button">
</div>

</form>

位置絶対フォーム検証エンジンを使用しています。

次のように検証をトリガーできます。jQuery( "#formID")。validationEngine();

問題は、各ステップに必要なフィールドがほとんどない可能性があることです。ウィザードを最初に渡すために、私は最初のステップと表示のみを示しています:他のdivはありません。ただし、この場合、ステップ1のすべての必須フィールドが提出されると、フォームはサーバーに送信されます。

どなたか、この状況に対処する方法を提案してください。理想的には、特定のステップのすべての必須フィールドに入力したら、次のステップに進み、送信しないでください。その逆も同様です。

いつもありがとうございます。

4

1 に答える 1

2

JavaScript(ここではjQuery)を使用して、各ボタンの後にフォームが送信されないようにします。

jQuery(".registration_step_1").click(function() { /*some code */ return false; } );
于 2012-11-09T01:01:45.927 に答える