0

ajaxで同じページに3stepウィザードを実装しようとしています。Form2 と Form3 を作成するために 2 つの php ファイルを使用します。Form2 を作成する最初のステップでは問題ありません。しかし、Form3 を作成する 2 番目のステップで行き詰まりました。以下の提案に従って Form2 の検証コードを変更しました。これが新しいコードです。createForm3.php から返されたデータは正しいですが、div id="form3" で表示できません。 

<script type="text/javascript">
  $(document).ready(function(){
    $("#form1").validate({ ...
      alert("I am in form1 validation");
      submitHandler: function(form) {   
              $.post('createForm2.php', $("#form1").serialize(), function(data) {
            $('#form2').html(data); 
                    $("#form2").validate({ ...
                    alert("I am in form2 validation");
                    submitHandler: function(form) {
                    $.post('createForm3.php', $("#form2").serialize(), function(data) {
                       alert(data);
               $('#form3').html(data);  });}});
   });}});      

});
</script>
<body>
<form name = 'form1' id = 'form1' action = '' method = 'POST'>
....
<input type = 'submit' name = 'submit' value = 'Submit'>
</form>
<div id="form2"><div>
<div id="form3"><div>
</body>

テスト用の createForm3.php で: echo " Show form 3 ";

4

2 に答える 2

0

form2 がまだ存在していないときに検証関数をアクティブにしているため、form2 で検証メソッドが呼び出されることはありません。

あなたがする必要があるのは、ajax コールバックで form2 のフォーム検証を呼び出すことです。

$(document).ready(function(){
    $("#form1").validate({ ...
      submitHandler: function(form) {   
              $.post('createForm2.php', $("#form1").serialize(), function(data) {
                    $('#form2').html(data); 
     $("#form2").validate({ ...})

   });}});


    });
于 2012-07-09T14:10:21.120 に答える
0

私が見る限り、おそらく#form2検証イベント ハンドラーを#form1送信ハンドラーの成功関数に移動する必要があります。

ここで、イベント ハンドラーを にアタッチすると#form2、その要素にはまだ ajax を使用して作成されるフォームがないため、アタッチしようとしても失敗します。

于 2012-07-09T14:04:53.087 に答える