Vérification formulaire AJAX

Tiorte
Javascript

Bonjour,

Je suis en train de faire des vérifications de formulaire en jQuery, jusque là tout va bien, mais j'aimerai vérifier par exemple, que dans un formulaire d'enregistrement, le pseudo saisi n'existe pas déjà. Du coup j'ai pensé à AJAX pour faire la requête PHP et me retourner le résultat. Le problème est que je n'arrive pas à récupérer le résultat de la requête AJAX dans mon programme principal.

Voilà ce que j'aimerai faire:

$('form.form-reg').submit(function(){
        var conform = true;
        var user = $('input[name=user]', this)
        $.post('action.php?type=user&action=verif_reg', { user : user.val() }, function(data){
            if(data.verif == false){
                conform = false;
            }
        });
        return conform;
    });

Mais impossible de trouver comment faire en sorte que le conform du callback porte en dehors de la fonction. Avez-vous une solution?

12 réponses

Tiorte
Auteur
Réponse acceptée

Voilà, merci de vos suggestions!

$('form.form-reg input[name=user]').keyup(function(){
       var user = $(this);
       $.post('action.php?type=user&action=check_user', {user : user.val()}, function(data){
           if(data.err == true){
               $('input[type=submit]').hide();
               user.css('border-color', 'red');
               if(user.parent().next('td').text() == ''){
                   user.parent().next('td').append('Ce nom d\'utilisateur est déjà pris.');
               }
           }else{
               $('input[type=submit]').show();
               user.css('border-color', '#cfcfcf');
               user.parent().next('td').empty();
           }
       }, 'json');
   });
Mousse

Peut être que cela pourra t'aider...

Tuto

Pour le télécharger, tu as besoin de t'inscrire ici tuto.com

Tiorte
Auteur

Il ne résout pas le problème, voilà son code:

$('#form').submit(function(){
      var pseudo = $('#pseudo').val();
      var dataString = 'pseudo='+pseudo;

      $.ajax({
        type: 'POST',
        url: 'check.php',
        data: dataString,
        success:function(data){
          var responseData = jQuery.parseJSON(data)
          if(responseData.status=='error')
          {
            $('.check_ok').hide();
            $('.check_false').fadeIn();
            $('.check_false').text(responseData.message);
          }
          else
          {
            $('.check_false').hide();
            $('.check_ok').fadeIn();
            $('.check_ok').text(responseData.message);
          }
        }
      });
      return false;
    });

Ce qui vérifie bel et bien, mais son formulaire n'est jamais envoyé ... En soi c'est .. inutile!

Mousse

Dans ce cas là tu peux dire en JS par exemple que quand le pseudo est déjà pris, tu grises le bouton ENVOYER. De cette façon, l'utilisateur ne pourras pas cliquer dessus.

PhiSyX

Bha si c'est envoyé, invisiblement par xhr (ajax), vu que tu reçois bien les données de check.php.
Le return false dans ce cas si, empêche la redirection d'être effectué, pas l'envoie. L'envoie des données a été déclaré avec $.ajax. À toi de gérer la redirection avec window.location = "url"; si c'est ok ^^

Tiorte
Auteur

@Mousse: Pour vérifier le pseudo il faut bien que l'utilisateur entre le sien et click sur envoyer pour lancer la requête. Ou alors il faut le faire en live en capturant l'action du clavier.

@PhiSyX: Dans ta méthode, tu soumet le formulaire en AJAX, or je ne fais que la vérification en AJAX, tout le reste se fait en php.

Vos solutions ne sont pas mauvaises, je les garde sous la main si je ne trouve pas d'alternative.

Mousse

Exact, désolé pour l'erreur, j'avais pas fait gaffe!
Dans ce cas là, tu peux faire un bouton (ou lien) à coté de l'input pseudo qui quand tu cliques, te dis si c'est ok ou non. Et du coup garder ton bouton d'envoi. (le mec qui essaye jusqu'au bout d'avoir raison lol...)

Tiorte
Auteur

Non mais c'est juste ce que tu dis! J'ai déjà visité des sites où c'était comme ça, je vais peut-être prendre ta solution, car envoyer un formulaire en AJAX ne me plait pas trop.

Mousse

Ah bin content que mon idée soit utile! ^^
Ou sinon pour éviter de foutre des boutons partout, tu dis à ajax de vérifier quand la personne sort de l'input. Je sais pas si tu vois ce que je veux dire.
Le mec clique dans l'input, il écrit son pseudo, et ensuite il veut ecrire son mot de passe donc il clique sur le second input et donc sort du premier.

Ca évite de vérifier à chaque lettre que l'utilisateur écrit et aussi de forcer l'utilisateur à cliquer sur les boutons de vérification à chaque fois.

Tiorte
Auteur

Encore une bonne idée qui peut soulager le serveur! :)

Mousse

Par contre je ne pourrai absolument pas te dire comment faire. Je n'ai pas eu assez de cours AJAX pour ça...

Tiorte
Auteur

Pas de soucis, je sais très bien, je posterai la réponse et je clôturerai le sujet quand je l'aurais fait. Dans pas très longtemps à vrai dire! ;)