Plugin Jquery blockUI ne fonctionne pas avec ajax
Je souhaite bloquer la page en cours lorsqu'un appel ajax est faite et l'utilisation d'un blockUI comme une boîte de message. Je ne peut pas utiliser de $(document).ajaxStart($.blockUI).ajaxStop($.unblockUI);
Mon code est le suivant..
bc.find('.submit').click(function (e) {
e.preventDefault();
if ($(this).hasClass('lock'))
return;
$.blockUI();
$(this).addClass('lock');
bc.submit();
});
var validator;
validator = bc.validate({
ignore: '',
rules: {
UserName: {
required: true
}
},
messages: {
UserName: 'must have',
},
submitHandler: function (form) {
$.ajax({
url: '/yyyy/xxxx',
type: 'POST',
data: postdata,
complete: function () {
bc.find('.submit').removeClass('lock');
},
success: function (data) {
if (data.status == 'OK') {
$.blockUI({ message: 'OK' });
......
}
else {
switch (data.status) {
case 'xxx':
......
}
$.unblockUI();
}
},
error: function () {
$.unblockUI();
alert('xxx');
}
});
}
});
Le scénario, c'est que lorsque je clique sur le .submit
bouton, la page est bloquée et un appel ajax est effectuée sur le serveur pour obtenir une réponse de données. Lors de l'appel ajax est un succès, j'ai débloquer la page en cours et si les données.le statut est "OK", j'affiche une boîte de message (également basé sur blockUI plugin). D'autre-je afficher une erreur sur la page en cours, puis le débloquer.
Modifier à 2016, il y a une édition qui changent la question du sens(peut-être à cause de ma mauvaise en anglais en ce moment), j'ai roulé revenir ici, et de le rendre plus clair, merci de ne pas changer de nouveau ci-dessous.
Mais en fait, seulement après l'appel ajax est terminé (debug étape sur le code de la ajax complete handler
), voir:
- première
$.blockUI();
exécutée - exécuter
$.blockUI({ message: 'OK' })
ou pas - puis
$.unblockUI()
être appelé
(Ci-dessus est ce que je veux dire anormale de l'exécution de la séquence de chrome ou firefox, outil de débogage dans la réponse.parce que blockui code
ne doit pas être exécuté après ajax complète)
Ce n'est pas ce que je veux, et je ne peux pas comprendre cela.
OriginalL'auteur Mithril | 2012-09-26
Vous devez vous connecter pour publier un commentaire.
Définir le blocage de l'INTERFACE utilisateur dans le beforeSend de la fonction et de la unBlockUI dans la fonction complète de sorte que vous obtenir le comportement que vous attendez.
Ce sera assurez-vous que votre Interface utilisateur de bloquer dès que la demande est envoyée et débloquer dès que sa..
J'ai eu le même problème, avez-vous trouver une réponse?
Dans ma situation,cette séquence de l'exécution anomalie provoquée par navigateur outils de débogage,chrome et firefox. Parce que j'ai utilisé outil de débogage pour confirmer si le $.blockUI() exécutée avant l'appel ajax,mais il y a toujours exécutée après avoir marché sur l'ensemble du gestionnaire de l'ajax.Lorsque j'ai mis un point d'arrêt dans le code côté serveur ,alors j'ai trouvé la séquence de l'exécution de devenir normal que je le veux!
J'ai été en mesure d'obtenir ce travail, mais j'ai dû faire en sorte que l'asynchrone a été définie à true.
Si vous définissez
asyn:true
alors c'est un mauvais signe. Vous êtes vaincre le but deAJAX
OriginalL'auteur Sushanth --
J'ai eu le même problème parce que j'ai utilisé sync appel ajax qui est aync est faux
Je l'ai résolu en faisant un appel ajax async true
OriginalL'auteur Paresh Radadiya
vous pouvez rendre votre code beaucoup plus simple avec un wrapper autour de l'ajax comme ajaxBlockUI - voir https://stackoverflow.com/a/28358070/460084
tout ce que vous aurez à faire est d'ajouter blockUI:fidèle à ajaxBlockUI et le réel de blocage et de déblocage de l'INTERFACE utilisateur seront traitées en interne.
OriginalL'auteur kofifus
Le problème était d'une séquence d'exécution anomalie provoquée par navigateur outils de débogage dans chrome et firefox. Avec le débogueur, j'ai confirmé que
$.blockUI()
exécutée avant que l'appel ajax ou pas. Il a toujours été d'exécution après, j'ai marché sur l'ensemble du gestionnaire en ajax. Tout à l'heure, j'ai mis un point d'arrêt dans le code côté serveur et j'ai trouvé que l'exécution de la séquence devient normal que je le veux!mise à jour 2016-01-25:
Remarque:
abnormal execution sequence
lors d'uneasync call
maintenant.(Mais je me souviens, à l'époque, l'ensemblea break point
sur la ligne -$.blockUI({ message: 'OK' });
en chrome outil de débogage, tapezF10
(aller) , serait de voir chrome simplement pas sur le point de rupture, et rien heppen)abnormal execution sequence
, maintenant, je pense que c'est peut-être parblockui
trop. Parce que nous ne voyons pas comment$.blockUI()
travaillé, peut-êtreblock element function
est stockée en profondeur à l'intérieur du chrome exécution de rappel de la pile. J'ai peut-placez le point d'arrêt à la mauvaise ligne Si cette hypothèse est vraie(donc peut-être besoin de définir un point d'arrêt dansblockui source code
)Et, je n'ai pas de travail avec
blockui
depuis de nombreuses années.Si vous voulez juste un bloc de la boîte de message, je suggère sweetalert.OriginalL'auteur Mithril