Ajaxリクエストは現在のページを更新するのではなく、新しいページに移動しますか？

Question

これは前に働いていて、何も変えなかったことを覚えていません。私はフォームを持っており、情報を "処理中の" PHPファイルに送り、応答を返すべきです。代わりに、単に "処理中"のPHPに行き、JSONデータを新しいページにエコーします。 JqueryはGoogleから含まれており、フォームページと「プロセス」ページは同じディレクトリにあります。

$data = array( 
    'status' => $status, 
    'message' => $errorMsg 
); 

echo json_encode($data); 

if ($status == "success"){ 
session_destroy(); 
} 
exit(); 

これは、すべての処理が終了した時点で行われます（データが良好であり、正常に動作していることを確認します）。これは使用されるjavascriptです：

$(document).ready(function(){ 
    $('#signupForm').submit(function(){ 
//various client side checks to keep form from submitting easy to see garbage 

if($(this).data('formstatus') !== 'submitting'){ 
    var responseMsg = $('#response'); 
    responseMsg.hide() 
       .addClass('response-waiting') 
       .text('Signing Up...') 
       .fadeIn(200); 



var dataString = //the data 
$.ajax({ 
    type: "POST", 
    url: "process.php", 
    data: dataString, 
    success: function(data) { 


      var responseData = jQuery.parseJSON(data), 
       messageClass = ''; 

      switch(responseData.status){ 
       case 'error': 
        messageClass = 'response-error'; 
       break; 
       case 'success': 
        messageClass = 'response-success'; 
       break; 
      } 

      responseMsg.fadeOut(200,function(){ 
       $(this).removeClass('response-waiting') 
         .addClass(messageClass) 
         .text(responseData.message) 
         .fadeIn(200,function(){ 
          setTimeout(function(){ 
           responseMsg.fadeOut(200,function(){ 
            $(this).removeClass(messageClass); 
           }); 
          },5000); 
         }); 


      }); 


     } 
}); 
} 

return false; 


}); 
}) 

具体的なものがある場合は、私に知らせてください、私は更新します。私が言ったように、私はそれが働いていた（昨日）と私は全く問題ではないと知っているトップでクライアント側のチェックを取る以外は何も変更覚えていません。

Answer 1

あなたのフォームアクションはprocess.phpという見出しであり、送信時にfalseを返さないとします。

エラーがまだないフォームが、JavaScriptでのエラー、その後、継続する場合には、この

<form name='myForm' action='nonjspage.php' method='post' onsubmit='return false;'></form> 

ようにする必要があります。使用しているブラウザーによってはエラーコンソールがあります。

Firefoxでは、メニュー - > Web開発者 - > Webコンソールに向かいます。

これを開いたら、ページをリロードしてもう一度送信ボタンを押すと、JavaScriptエラーに関する情報が表示されます。

Answer 2

これを解決するのに役立つものはいくつかあります。

最初に、クリックイベントが発生するのを防ぐためにreturn falseを使用しないことをお勧めします。

これは、関数の先頭にするのがベストプラクティスです

preventDefault(); 

これは提出ので、投稿ページをロードする代わりに、AJAX呼び出しを行ってからフォームを停止する必要がありhttp://fuelyourcoding.com/jquery-events-stop-misusing-return-false/

を参照ください。

2番目の問題は、明らかにヒットしていない返信偽の呼び出しがあることです。上記の修正では、フォームの送信が停止されますが、開始と戻りの間のコードにjavascriptエラーがあると思われます。これにより例外がスローされ、したがってfalseが返されることはありません。上記の修正が適用され、リダイレクトが停止されたら、ブラウザーのコンソールで例外をチェックします。

乾杯