アイコンをロードしてから新しいページにリダイレクト

Question

「追加」という名前のボタンと情報で構成される「ページ1」というページが1つあります。

このボタンをクリックすると、約10個のフィールドと送信ボタンからなるフォームからなるポップアップモーダルウィンドウが開きます。このボタンをクリックすると、フォームを送信するためにajax投稿が使用され、サーバー側で操作の挿入と更新が行われ、成功または失敗の結果が返されます。

このAjax処理中に、読み込み中の画像を表示しています。私が試しているのは、この読み込みイメージの直後です。新しいページにリダイレクトする必要があります。 "page2"と言うことができます。しかし私のコードでは、このロードが停止した後、モーダルウィンドウと "page1"が約2〜3秒間表示され、次にそれが "page2"にリダイレクトされるのがわかります。

私の質問が論理的かどうかは分かりませんが、それを止める方法があるかどうかはまだ分かりません。 以下私はAJAX処理コードを持っています。

ありがとうございます。

$.ajax({ 
     type: 'POST', 
     url: 'page2.php', 
     data: { 
      'data': form_data 
     }, 
     success: function(response) 
     { 
      var arr = JSON.parse(response); 
      if(arr.success == true) { 
       window.location.href = 'page3.php'; 
      } 
      else { 
       alert('There are some error while saving record.'); 
      } 
     }, 
     beforeSend: function() 
     { 
      $('.loader').show().delay(9000); 
     }, 
     complete: function(){ 
      $.fancybox.close(); 
      $('.loader').hide(); 
     } 
    }); 

Answer 1

$.ajax({ 
    success: function(response) 
    { 
     ... 
     if(arr.success == true) { 
      ... 
     } 
     else { 
      ... 
      $('.loader').hide(); 
     } 
    }, 
    ... 
    complete: function(){ 
     $.fancybox.close(); 
    } 
}); 

ajaxrequestが行われた後、ローダーを非表示にしないでください。