すべてのajax呼び出しが完了したことを知る方法
2023-10-15 06:01:04
質問
行を持つテーブルスタイルのページがあります。各行にはチェックボックスがあります。私はすべて/多くのチェックボックスを選択し、"submit"をクリックすることができ、それが行うことは各行のJquery ajax呼び出しです。
基本的に、私は各行のためのフォームを持っており、私はすべてのチェックされた行を繰り返し、jquery ajaxの呼び出しを行うそのフォームを送信します。
だから、私はそれを行うボタンを持っています。
$("input:checked").parent("form").submit();
では、各行が
<form name="MyForm<%=i%>" action="javascript:processRow(<%=i%>)" method="post" style="margin:0px;">
<input type="checkbox" name="X" value="XChecked"/>
<input type="hidden" id="XNumber<%=i%>" name="X<%=i%>" value="<%=XNumber%>"/>
<input type="hidden" id="XId<%=i%>" name="XId<%=i%>" value="<%=XNumber%>"/>
<input type="hidden" id="XAmt<%=i%>" name="XAmt<%=i%>" value="<%=XAmount%>"/>
<input type="hidden" name="X" value="rXChecked"/>
</form>
このフォームはprocessRowにサブミットします。
function processRow(rowNum)
{
var Amount = $('#XAmt'+rowNum).val();
var XId = $('#XId'+rowNum).val();
var XNum = $('#OrderNumber'+rowNum).val();
var queryString = "xAmt=" + "1.00" + "&xNumber=" + OrdNum + "&xId=" + xId;
$('#coda_'+rowNum).removeClass("loader");
$('#coda_'+rowNum).addClass("loading");
$.ajax({
url: "x.asp",
cache: false,
type: "POST",
data: queryString,
success: function(html){
$('#result_'+rowNum).empty().append(html);
$('#coda_'+rowNum).removeClass("loading");
$('#coda_'+rowNum).addClass("loader");
}
});
}
私が知りたかったことは、このことから、すべてのAjax呼び出しが完了したかどうかを知ることができる方法があるかということです。理由は、これらのすべての呼び出しが行われている間、送信ボタンを有効または無効にしたいからです。
ありがとうございます。アプリケーションの機密性のために私の変数名をこじつけなければならなかったので、それらの多くは重複しているかもしれないことに留意してください。
どのように解決するのですか?
簡単な方法
最も簡単な方法は
.ajaxStop()
イベントハンドラ
:
$(document).ajaxStop(function() {
// place code to be executed on completion of last outstanding ajax call here
});
ハードな方法
Ajax呼び出しがまだアクティブかどうかを手動で検出することもできます。
アクティブなAjax接続の数を含む変数を作成します。
var activeAjaxConnections = 0;
新しい Ajax 接続を開く前に、この変数をインクリメントします。
$.ajax({
beforeSend: function(xhr) {
activeAjaxConnections++;
},
url (...)
で
success
の部分は、その変数が0に等しいかどうかをチェックします(等しい場合、最後の接続は終了しています)。
success: function(html){
activeAjaxConnections--;
$('#result_'+rowNum).empty().append(html);
$('#coda_'+rowNum).removeClass("loading");
$('#coda_'+rowNum).addClass("loader");
if (0 == activeAjaxConnections) {
// this was the last Ajax connection, do the thing
}
},
error: function(xhr, errDesc, exception) {
activeAjaxConnections--;
if (0 == activeAjaxConnections) {
// this was the last Ajax connection, do the thing
}
}
見ての通り、エラーで戻るかどうかのチェックも追加しています。
関連
-
[解決済み] jquery - is not a function エラー
-
[解決済み] どのラジオボタンが選択されているかをjQueryで知るにはどうしたらよいですか?
-
[解決済み] jQuery Ajax呼び出し後のリダイレクトリクエストを管理する方法
-
[解決済み] どうすればjQueryに非同期ではなく、同期のAjaxリクエストを実行させることができますか?
-
[解決済み] jQuery の Ajax リクエストがすべて終了するまで待ちますか?
-
[解決済み] チェックボックスのチェック/アンチェックは、jqueryを使用していますか?重複
-
[解決済み] jQueryでtextareaの値を設定する
-
[解決済み] GoogleのCDNからjQuery UI CSSをダウンロードする
-
[解決済み] jQuery: outer html() [重複]。
-
[解決済み】一部のAJAXコールで "net::ERR_BLOCKED_BY_CLIENT "エラーが発生する。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] jquery 3.0 url.indexOfエラー
-
[解決済み] JavaScript - 二重引用符のエスケープ
-
[解決済み] jQueryでdata属性で要素を選択する
-
[解決済み] jQuery の Ajax リクエストがすべて終了するまで待ちますか?
-
[解決済み] Twitter Bootstrapのモーダルウィンドウを閉じないようにする
-
[解決済み] jQueryで複数のCSS属性を定義するには?
-
[解決済み] jQueryを使用してテキストボックスの値を取得するには?
-
[解決済み] jQueryの.ajax()メソッドが私のセッションクッキーを送信しないのはなぜですか?
-
[解決済み] jQueryで、ある要素を他の要素に対して相対的に配置するには?
-
[解決済み] jQuery.active関数