2012-04-15 2 views
1

Je voudrais arrêter un formulaire en soumettant par thr résultat d'une requête ajax ... c'est le code que j'ai essayé d'utiliser: La fonction chreg() devrait retourner un booléen donné de la requête ajax, mais ce n'est pas le cas!Arrêtez de soumettre à partir de javascript ajax request

Javascript:

function chreg() { 

user = document.getElementById('nome').value; 
passw1 = document.getElementById('passw1').value; 
passw2 = document.getElementById('passw2').value; 
mai = document.getElementById('mail').value; 
dat = 'use='+encodeURIComponent(user)+'&pas='+encodeURIComponent(passw1)+'&pas2='+encodeURIComponent(passw2)+'&mail='+encodeURIComponent(mai); 

htp = new XMLHttpRequest; 
htp.onreadystatechange = function(){ 

    if (htp.readyState == 4 && htp.status == 200){ 
     if (htp.responseText == "true"){ 
      alert('true'); 
     return true; 
     } 
     else { 
     document.getElementById('er2').innerHTML = '<br/><h3>'+tag_esc(decodeURIComponent(htp.responseText))+'</h3>'; 
     return false; 
     } 


    } 
}; 
a = Math.random 
    htp.open("POST","checklog.php?a="+a,true); 
    htp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
    htp.send(dat); 
} 

Et le code HTML:

<form action="reg.php" method="POST" onsubmit="return chreg(this);"> 
<table id="tab2"><tr><td> 

<label for="user1">Username: <input type="text" name="user" id="nome" /></label></td>  <td> 
<label for="mail">Indirizzo e-mail: <input type="text" name="mail" id="mail" /></label> </td> 
</tr> 
<tr><td><label for="pass1">Password: <input type="password" name="pass1" id="passw1" /> </label></td> 
    <td><label for="pass2">Password (conferma): <input type="password" name="pass2" id="passw2" /></label></td></tr> 
    <tr><td colspan="2"><br /><input type="submit" class="st" value="Registrati" /></td> </tr> 

</table> 
<div id="er2"></div> 
</form> 

Mais cela ne fonctionne pas! Aide Merci beaucoup!

Répondre

1

Vous ne serez pas en mesure de le faire fonctionner tel qu'il est parce que AJAX est asynchrone par défaut. Cela signifie que votre méthode chreg initie la demande et renvoie immédiatement, avant que la demande ne soit terminée et que son résultat ne soit connu. Ceci est un problème car vous ne pouvez pas revenir de chreg avant que le résultat soit connu puisque vous avez besoin de ce résultat pour savoir ce que retourner.

Une solution serait de faire la synchronisation de la demande en modifiant le troisième paramètre ici:

// you will not need to set onreadystatechange at all 

htp.open("POST","checklog.php?a="+a,false); // false = synchronous 
htp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
htp.send(dat); 
if (htp.responseText == "true"){ 
    alert('true'); 
    return true; 
} 
else { 
    document.getElementById('er2').innerHTML = '<br/><h3>'+tag_esc(decodeURIComponent(htp.responseText))+'</h3>'; 
    return false; 
} 

Ce n'est pas la meilleure solution, car il pourrait finir par bloquer l'interface utilisateur pour la durée de la demande, qui est indésirable. Cependant, pour en revenir au modèle asynchrone (qui n'a pas ce problème) va être plus impliqué parce qu'il vous oblige à faire des choses « à l'envers »:

  1. Fonction chreg est appelée et fait la demande AJAX; il toujours retours false (de sorte que la forme ne soit pas soumis)
  2. Lorsque le gestionnaire onreadystatechanged vous avez installé détecte que l'AJAX est terminée, il vérifie la réponse. Si la réponse est logiquement vraie (le formulaire doit être soumis), utilisez form.submit pour le faire.
+0

merci pour la réponse ... Mais la soumission ne s'arrête pas! – user260031

+0

@ user1296041: J'ai juste ajouté deux lignes (dont celle avec 'send') au code de l'exemple - l'avez-vous essayé de cette façon et cela n'a pas fonctionné? – Jon

+0

Je n'ai pas rechargé cette page donc je n'ai pas vu le nouveau code ... IT WORKS !!! Merci beaucoup! – user260031

1

Votre fonction de gestionnaire de succès renvoie true ou false, mais pas votre méthode principale chreg.

Vous devez retourner false dans votre méthode chreg pour arrêter la soumission du formulaire.

[...] 
    htp.send(dat); 
    return false; 

Puisque vous manipulez la soumission du formulaire par ajax, vous voudrez probablement pas le formulaire pour faire un postback atall.

+0

merci pour la réponse, mais si la fonction chreg retourne false, elle retourne false aussi lorsque la réponse ajax est vrai! et les arrêts de soumission! – user260031

+0

Vous utilisez ajax qui est asynchrone par nature. Pourquoi voulez-vous soumettre le formulaire lorsque la réponse ajax est vraie? Vous gérez la soumission du formulaire dans la requête ajax, n'est-ce pas? –

0
<!DOCTYPE html> 
<html> 
<body> 

<h1>My First JavaScript</h1> 

<p>Please input a number.</p> 

<input id="demo" type="text"> 

<script> 
function myFunction() 
{ 
var x=document.getElementById("demo").value; 
if(x==""||isNaN(x)) 
     { 
     alert("Not Numeric"); 
     } 
} 
</script>