2011-08-11 5 views
0

Je ne peux pas obtenir ce formulaire pour soumettre correctement. Si j'ai le type de bouton "soumettre" il soumet toujours et si j'utilise "bouton" comme le type qu'il ne soumet jamais, l'appel ajax apporte les valeurs correctes, même si l'instruction if suit le chemin correct, mais il ne semble pas à la matière.jquery soumettre ne fonctionne pas

<script type="text/javascript"> 
$(document).ready(function(){ 
$("#submitButton").click(function(e) { 
     var un = $('#username').val(); 
     $('#mike').html("");  
      $.ajax(
      {    
       type: "POST", 
       url: "Utilities/CheckUsername.php", 
       data: "un="+ un, 
       success: function(data2) 
       {     
        if(data2=="Username Does Not Exist") 
        {   
         $("#login2").submit();     
        } 
        else 
        { 
         $('#mike').html(data2); 
         return false;      
        }     
       } 

      }); 
      }); 

      }); 
      </script> 
</head> 
<body> 
     <form name="login" id="login2" method="post" action="dsds.html"> 
     UserName<input type="text" name="username" id="username"value=""> 
     <br/> 
     Password<input type="text" name="password" id="password" value=""> 
     <br/> 
     Password Again<input type="text" name="passwordagain" id="passwordagain" value=""> 
     <br/> 
     <input type="hidden" name="NewClass" id="NewClass" value="true"> 
     <br/> 
     <input type="submit" name="no" id="submitButton" value="submit"> 
    </form> 
    <span id = "mike"></span> 
</body> 
</html> 

EDIT: Je ajouté le retour faux ici et il fonctionne, mais pourquoi? Je viens de rentrer faux de l'événement click

else 
      { 
       $('#mike').html(data2); 

      }     
     } 

    }); 
    return false; 
    }); 

Répondre

3

Vous avez juste besoin de votre return false soumettre gestionnaire d'événements. Le return false vous avez là n'est pas effectué jusqu'à après l'appel ajax asynch est terminé. Vous pouvez également utiliser e.preventDefault() qui fait la même chose.

Les deux méthodes empêchent simplement le comportement par défaut, c'est-à-dire l'envoi du formulaire.

+0

a résolu mon problème. La plainte était que le fichier $ .post (..) n'était pas défini. –

2

je vous suggère de lier le gestionnaire d'événements à l'événement submit de la forme:

$('#login2').submit(function(event) { 
    event.preventDefault(); 
    //... 
}); 

Vous avez pour empêcher l'action par défaut pour l'événement, qui présente le formulaire. Ceci est fait avec event.preventDefault[docs]. Le return false à l'intérieur du rappel Ajax n'aura aucun effet, car le gestionnaire d'événements renvoie avant la réponse a été reçue.

Si vous faites cela, vous devez définir une sorte de drapeau pour voir dans quel état du processus que vous êtes:

var nameAvailable = false; 

$('#login2').submit(function(event) { 
    if(!nameAvailable) { 
     event.preventDefault(); // don't submit form 
     //... 
     $.ajax({ 
      success: function() { 
       // if name available 
       nameAvailable = true; 
       $('#login2').submit(); 
      } 
     }); 
    } 
}); 
Questions connexes