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 :
Mon script jQuery
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>
Et ce que dois renvoyer PHP pour l'instant
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); } }); }); });
Code php : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3 <?php echo json_encode(print_r($_POST)); ?>
Partager