IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

jQuery Discussion :

Envoi d'un formulaire sans changer de page


Sujet :

jQuery

Mode arborescent

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Invité
    Invité(e)
    Par défaut Envoi d'un formulaire sans changer de page
    Bonjour, je suis actuellement en train de développer un site et je me suis dit "Pourquoi ne pas utiliser AJAX pour vérifier les données de mon inscription ?" J'ai donc commencé mon code mais lors de l'envoie de mon formulaire, mon navigateur me redirige vers la page sensée traiter les données alors que je veux rester sur la même page et afficher l'erreur qui ne va pas.

    Voici mon formulaire :
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    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
    31
    32
    33
    34
    35
    <form method="POST" onsubmit="return false" action="includes/verifinscription/verification.php" id="insc_form" class="form-horizontal" style="margin:20px;">
    	<div class="form-group" id="insc_pseudo">
    	    <label for="pseudo" class="col-lg-2 control-label" style="width:200px;">Pseudonyme</label>
    	    <div class="col-lg-6">
    	      	<input type="text" id="insc_input_pseudo" class="form-control" name="pseudo" placeholder="Pseudonyme Minecraft.net" onkeypress="return verif_char_pseudo(event);">
    	    	<span id="pseudo_ajax" style="display:none;"><img src="img/loader.gif"></span>
    	    </div>
    	</div>
     	<div class="form-group" id="insc_mail">
    	    <label for="mail" class="col-lg-2 control-label" style="width:200px;">Adresse électronique</label>
    	    <div class="col-lg-6">
    	      	<input type="email" id="insc_input_mail" class="form-control" name="mail" placeholder="Adresse électronique">
    	    	<span id="mail_ajax" style="display:none;"><img src="img/loader.gif"></span>
    	    </div>
    	</div>
    	<div class="form-group" id="insc_pswd">
    	    <label for="pswd" class="col-lg-2 control-label" style="width:200px;">Mot de passe</label>
    		<div class="col-lg-6">
    	      	<input type="password" id="insc_input_pswd" class="form-control" name="pswd" placeholder="Mot de passe">
    	    </div>
      	</div>
    	  	<div class="form-group" id="insc_pswdv">
    	    <label for="pswdv" class="col-lg-2 control-label" style="width:200px;">Mot de passe</label>
    	    <div class="col-lg-6">
    	      	<input type="password" id="insc_input_pswdv" class="form-control" name="pswdv" placeholder="Encore une fois">
    	    </div>
      	</div>
    	<div class="checkbox">
        	<label>
          		<input type="checkbox" name="checkbox" id="insc_checkbox"> J'accepte les <a onclick="alert(regles);">règles</a> et m'engage à les respecter.
        	</label>
      	</div>
      	<div id="ajax_return"></div>
      	<input type="submit" id="insc_sub" class="btn btn-orange btn-block" style="margin-top:20px;" value="S'inscrire">
    </form>
    Mon script jQuery
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    $(document).ready(function(){
    	$("#insc_form").on("submit", function(){
    		$.ajax({
                            url: $this.attr("action"),
                            type: $this.attr('method'),
                            data: $this.serialize(),
                            dataType: 'json',
                            success: function(data){
                	            $("#ajax_return").append(data);
                                alert(data);
                            }
                    });
    	});
    });
    Et ce que dois renvoyer PHP pour l'instant
    Code php : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    <?php
    	echo json_encode(print_r($_POST));
    ?>
    Dernière modification par NoSmoking ; 21/05/2014 à 07h44. Motif: Merci d'indiquer le langage utilisé ([code=xxx]) pour activer la coloration syntaxique.

Discussions similaires

  1. Envoi de formulaire sans recharger la page
    Par argon dans le forum jQuery
    Réponses: 12
    Dernier message: 22/09/2014, 05h27
  2. JEE : affichage d'un formulaire aprés un choix du menu sans changer la page
    Par lavienormale dans le forum Développement Web en Java
    Réponses: 0
    Dernier message: 04/05/2011, 16h19
  3. submit sans changer de page
    Par trax44 dans le forum Général JavaScript
    Réponses: 3
    Dernier message: 22/11/2006, 10h05
  4. Réponses: 1
    Dernier message: 24/09/2006, 14h36
  5. Changer d'adresse de page sans changer de page...
    Par CFP dans le forum Balisage (X)HTML et validation W3C
    Réponses: 3
    Dernier message: 28/02/2006, 13h15

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo