Comment savoir si jQuery a une requête Ajax en attente?
j'ai quelques problèmes avec un contrôle jQuery que nous avons fait. Supposons que vous avez une dropdownlist qui vous permet d'entrer L'ID de l'élément que vous recherchez, et que lorsque vous appuyez sur Entrée ou perte de focus dans une zone de texte, il valide via jQuery que l'ID que vous avez entré est correct, montrant une alerte si elle ne l'est pas.
la chose est que quand un utilisateur ordinaire entre une valeur invalide en elle et perd la mise au point en appuyant sur le bouton soumettre, le jquery post retourne après la soumission de le formulaire a été envoyé.
est-ce que je peux vérifier s'il y a un traitement de demande Async par jQuery de sorte que je n'autorise pas le formulaire soumettre?
5 réponses
$(function () {
function checkPendingRequest() {
if ($.active > 0) {
window.setTimeout(checkPendingRequest, 1000);
//Mostrar peticiones pendientes ejemplo: $("#control").val("Peticiones pendientes" + $.active);
}
else {
alert("No hay peticiones pendientes");
}
};
window.setTimeout(checkPendingRequest, 1000);
});
The $.la fonction ajax () renvoie un objet XMLHttpRequest. Stockez cela dans une variable accessible depuis L'événement "OnClick" du bouton Soumettre. Quand un clic soumettre est traité, vérifiez si la variable XMLHttpRequest est:
1) null, ce qui signifie qu'aucune demande n'a encore été envoyée
2) que la valeur de readyState est 4 (chargé). Cela signifie que la demande a été envoyée et retournée avec succès.
dans l'un ou l'autre de ces cas, retourner true et permettre à la soumission de continuer. Sinon, retourne false pour bloquer le présenter et de donner à l'utilisateur une indication de leur soumettre n'a pas fonctionné. :)
Nous devons utiliser $.Ajax.abort () méthode pour annuler la requête si la requête est active. Cet objet de promesse utilise la propriété readyState pour vérifier si la requête est active ou non.
HTML
<h3>Cancel Ajax Request on Demand</h3>
<div id="test"></div>
<input type="button" id="btnCancel" value="Click to Cancel the Ajax Request" />
Code JS
//Initial Message
var ajaxRequestVariable;
$("#test").html("Please wait while request is being processed..");
//Event handler for Cancel Button
$("#btnCancel").on("click", function(){
if (ajaxRequestVariable !== undefined)
if (ajaxRequestVariable.readyState > 0 && ajaxRequestVariable.readyState < 4)
{
ajaxRequestVariable.abort();
$("#test").html("Ajax Request Cancelled.");
}
});
//Ajax Process Starts
ajaxRequestVariable = $.ajax({
method: "POST",
url: '/echo/json/',
contentType: "application/json",
cache: false,
dataType: "json",
data: {
json: JSON.encode({
data:
[
{"prop1":"prop1Value"},
{"prop1":"prop2Value"}
]
}),
delay: 11
},
success: function (response) {
$("#test").show();
$("#test").html("Request is completed");
},
error: function (error) {
},
complete: function () {
}
});