Ajax lors d'un submit

Bonjour.

J'utilise struts 2 mais souhaite gerer l'ajax "manuellement", c'est à dire sans aucun plugin (jar) supplémentaire, (struts-jquery ou dojo).

J'ai donc un formulaire qui lance une action struts lors du submit.

Je souhaite lors de la validation du formulaire, déclencher une action ajax pour afficher par exemple une barre de progression le temps que l'action s'exécute et avant que j'arrive à la page suivante.

Dans l'exemple (pour plus de simplicité), je souhaite afficher tout simplement un DIV suite à la validation du formulaire.

JSP :

Code:

---

1 2 3 4

<s:form method="POST" action="validerConnexion" namespace="/"> <!--<s:textfield name="utilisateur.utCode" label="%{getText('label.utilisateur.utCode')}" onblur="johannjs();"/>--> <s:textfield name="utilisateur.utCode" label="%{getText('label.utilisateur.utCode')}" /> ...

---

JAVASCRIPT :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30

$(document).ready(function(e) { $( "#monsubmitjquery" ).click(function(e) { // e.preventDefault(); johannjs(); // return false;   // si return false : la fonction johannjs (ajax) sort en erreur et le formulaire est submitté //si pas return false : elle s'exécute bien mais le formulaire n'est pas submitté.   });   });   function johannjs() { var data = $('#validerConnexion').serialize(); $.ajax({ type : "POST", url : "/DMIST/validerConnexionAjax.action", data : data, beforeSend : function(response) { $('#div2').html('coucou beforeSend'); }, success : function(response) { $('#div2').html(response); }, error : function(e) { alert('Error: ' + e); } }); }

---

Comme indiqué dans le javascript, je n'arrive pas à exécuter l'ajax ET submitter le formulaire.
J'ai lu que cela pouvait venir du fait que l'évènement "onclick" attendait un "return false".
Le problème que j'ai :
si je mets "return false" : la fonction johannjs (ajax) sort en erreur et le formulaire est submitté
si je ne mets pas "return false" : elle s'exécute bien mais le formulaire n'est pas submitté.

Y-aurait-il une solution?

Pour votre information, ma foction ajax fonctionne très bien si la déclenche sur l'évènement onBlur d'un élément (textfield) du formulaire.

Merci d'avance.
Johann

$('#validerConnexion').serialize(); ID ? <s:form method="POST" action="validerConnexion" namespace="/">.

l'id du formulaire est implicite , car le code html généré est :

Code:

---

1 2 3 4

<form id="validerConnexion" name="validerConnexion" action="/DMIST/validerConnexion.action" method="POST"> <table class="wwFormTable"> .... </form>

---

Code:

---

url : "/DMIST/validerConnexionAjax.action",

---

Heu... tu es sûr que c'est une URL valide ça ?

Oui celle-ci est valide car quand je l'exécute manuellement, j'ai bien ce que j'attends dans le success.

Après de nouveaux tests en utilsant directement le onclick au niveau du bouton submit :

si le submit est comme cela

Code:

---

1 2	<s:submit id="monsubmit" value="%{getText('btn.label.login')}" onclick="johannjs();return false" />

---

la fonction johannjs() s'exécute correctement. (/DMIST/validerConnexionAjax.action sort en succès)
Par contre, le formulaire n'est pas submitté car l'action du formulaire n'est pas appelée. (pas d'appel à /DMIST/validerConnexion.action)

Code:

---

1 2 3 4

<s:submit id="monsubmit" value="%{getText('btn.label.login')}" onclick="johannjs();return true" /> ou <s:submit id="monsubmit" value="%{getText('btn.label.login')}" onclick="johannjs();" />

---

la fonction ajax sort en erreur car j'ai "l'alert" qui s'affiche
Suite au clic sur ce popup, le formulaire est bien submitté au travers de l'action par défaut de celui-ci.


Je ne vois donc pas comment je peux au moment de la validation de mon formulaire :
exécuter mon johannjs() qui lance une fonction ajax (/DMIST/validerConnexionAjax.action) afin qu'elle s'exécute en arrière plan et raffraichisse l'écran avant le retour de l'action principale du formulaire.

Cdt

Pour votre information, je n'ai pas cette erreur sous IE.
Mais ce que je souhaite faire doit fonctionner sous Firefox/Chrome.

Je comprends rien à ce que tu veux faire...

Bref, si tu veux d'abord exécuter ta requête AJAX et une fois que celle-ci a renvoyé la réponse, soumettre ton formulaire, tu peux au choix :

• faire une requête synchrone ;
• utiliser un input type button, lancer la requête au clic de celui-ci et dans le callback success, soumettre manuellement le formulaire.

Lors de l'appui sur le bouton du formulaire, je souhaite que la fonction ajax se lance puis que l'action du formulaire s'exécute normalement (hors AJAX).

Dans ma fonction AJAX (dans le success), je voulais rajouter un appel à setTimeout('johannjs()', 1000);
afin que celle-ci s'exécute en boucle tant que le traitement de l'action du formulaire est en cours.

Le but est de rafraichir mon écran avec le formulaire afin d'indiquer à l'utilisateur où en est le traitement proncipal.


Aurais-tu un exemple pour ta dernière réponse?