Ajaxはリダイレクトが完了するまで待機します。

Question

私は基本的に以下のリンクで説明されているものと同じ問題がありますが、解決策がはっきりと分かりません。ウィンドウ関数が実行を終了するまで待つように私のAjax成功関数を設定したいのですが、divを変更してください。代わりに、現在のページのdivを変更してリダイレクトします。 AJAX: on success redirect then modify new page

main.js 

$("#form").submit(function(e) { 
    e.preventDefault(); 
    var id = $('#searchbar').val(); // store the form's data. 
     $.ajax({ 
       url: '/search', 
       type: 'POST', 
       data: {id:id}, 
       dataType: 'text', 


      success: function(data) { 

       //Redirect to the page where we want to display the data 
       window.location.href = '/test'; 


       data = JSON.parse(data); 
       console.log(data); 
       $("#count").text("we analyzed..."); 
       $("#result1").text(data.county); 
       $("#totals").text("with a score of.."); 
       $("#result2").text(data.totalSentiments); 


    }, 
    error: function(jqXHR, textStatus, errorThrown){ 
    console.log("error") 
    alert(textStatus, errorThrown); 
    } 
}); 

}); 

Answer 1

：あなたのアヤックス成功し

：

data = JSON.parse(data); 
console.log(data); 
window.location.href = '/test?county='+data.county+'&sentiment='+totalSentiments; 

その後ジャバスクリプトブロックでのごtestページ書き込みのを。

main.js同じページ上の準備ができました

$("#form").submit(function(e) { 
    e.preventDefault(); 
    var id = $('#searchbar').val(); // store the form's data. 
     $.ajax({ 
       url: '/search', 
       type: 'POST', 
       data: {id:id}, 
       dataType: 'text', 


      success: function(data) { 

       //Redirect to the page where we want to display the data 
       window.location.href = '/test'; 


       data = JSON.parse(data); 
       console.log(data); 
       // Store 
       localStorage.setItem("count", "we analyzed..."); 
       localStorage.setItem("result1", data.county); 
       localStorage.setItem("totals", "with a score of.."); 
       localStorage.setItem("result2", data.totalSentiments); 

    }, 
    error: function(jqXHR, textStatus, errorThrown){ 
    console.log("error") 
    alert(textStatus, errorThrown); 
    } 
}); 

}); 

：ブラウザーストレージで

jQuery(document).ready(function(){ 
    if (localStorage.count) { 
     $("#count").text(localStorage.count); 
    } 
    if (localStorage.result1) { 
     $("#result1").text(localStorage.result1); 
    } 
    if (localStorage.totals) { 
     $("#totals").text(localStorage.totals); 
    } 
    if (localStorage.result2) { 
     $("#result2").text(localStorage.result2); 
    } 
}); 

ローカルストレージデータを保管します。ローカルストレージからデータを削除することもできます。

Answer 2

location.hrefの値を設定すると、フルページの更新が発生します。

したがって、すべてのスクリプトは消去されます。

リダイレクトされたページへのajax呼び出しの結果を本当に使用したい場合は、この応答データをどこかに保存してから、新しいページに再利用する必要があります。

//save "data" in localSotorage 
localStorage.myAjaxResponse = data; //if data is JSON then use: JSON.stringify(data) instead. 

次に、 "/ test"ページで、localStorageの値を確認するスクリプトを作成して表示します。

data = JSON.parse(localStorage.myAjaxResponse); 
    console.log(data); 
    $("#count").text("we analyzed..."); 
    $("#result1").text(data.county); 
    $("#totals").text("with a score of.."); 
    $("#result2").text(data.totalSentiments); 

しかし、あなたが望むものを達成するための他のより良い方法があります。