Bonjour à tous,
Voilà, depuis 3 jours j'essaie de faire un formulaire d'update en ajax et php sans rafraîchir la page pour les utilisateurs, c'est à dire sur leurs page de profile si il souhaite changer leurs adresse mail ou mot de passe. avec ce que j'ai je n'y arrive pas ou presque bon mais au faite pour le faire j'ai pris le même code ajax sur l'inscription des utilisateurs je ne sais pas si on doit faire comme sa ou il faut modifier le code, je suis pas encore très à l'aise avec ajax. quelqu'un peut m'aider a résoudre mon problème ca serait génial , merci d'avance.
formulaire d'update :
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
36
37
38
39
40
41 <!-- FORM FOR UPDATE PROFILE --> <div class="ui tab segment " data-tab="param-tab"> <form method="post" action="" id="updateprofile" > <div class="row"> <div class="heading-content text-center"> <div class="heading"> <h4 class="title" style="color:#dedede;text-transform: uppercase;">Paramètres du compte<i class="fas fa-cog fa-spin" style="margin-left:5px;color: #004c6b;"></i></h4> </div> </div> <div id="update_success" class="ui blue message" style="max-width: 350px;display:none;">Vos informations on été mise a jours.<i class="check circle outline icon" style="margin-left:9px;color:#40ff56;"></i></div> <div class="col-md-12 col-sm-12 col-xs-12"> <div class="form-group validate-input"> <label for="email"><i class="fa fa-at" id="user"></i>Votre adresse mail</label> <input type="email" class="form-control input-label" style="max-width: 350px;" id="email" name="email" placeholder="Email" value="<?php echo $user['email']; ?>" required> </div> </div> <div class="col-md-12 col-sm-12 col-xs-12"> <div class="form-group validate-input"> <label for="pseudo"><i class="fa fa-user" id="user"></i>Votre pseudo</label> <input type="text" class="form-control input-label" style="max-width: 350px;" id="pseudo" name="pseudo" placeholder="Votre pseudo" value="<?php echo $_SESSION['pseudo']; ?>" disabled /> </div> </div> <div class="col-md-12 col-sm-12 col-xs-12"> <div class="form-group"> <label for="password"><i class="fa fa-lock" id="user"></i>Votre mot de passe</label> <input type="password" class="form-control input-label" style="max-width: 350px;" id="password" name="newpassword" placeholder="Votre mot de passe"> </div> </div> <div class="col-md-12 btn-resp"> <button type="submit" class="ui inverted primary basic button btn-default btn abt-btn" name="envoi">sauvegarder<i class="fas fa-sign-in-alt sign" style="margin-left: 5px;"></i> <span class="spinner-grow spinner-grow-sm loading hide" role="status" aria-hidden="true"></span> </button> </div> </div> </form> </div> <!-- FORM FOR UPDATE PROFILE -->
Ajax:
et code php update.php:
Code : 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
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50 $(document).ready(function() { $('#updateprofile').on('submit', function(e){ form = $('form#updateprofile') button = form.find('button'); $.ajax({ url: './users/update.php', type: 'POST', type: $(this).serialize(), dataType: 'json', beforeSend: function() { $(".spinner-grow").removeClass("hide"); $(".sign").addClass("hide"); button.prop('disabled', true); form.find('div.invalid-feedback').remove(); form.find('input').each(function() { $(this).removeClass('is-invalid'); }); } }).done(function(data) { if(data != undefined && data != '') { if(data.success) { form.fadeOut(function() { $('#update_success').fadeIn(); setTimeout(function(){ window.location.replace("http://localhost/xampp/DEv/index.php"); }, 8000) }); } else { form.find('button').html("S'inscrire"); button.prop('disabled', false); if(data.errors.length > 0) { errors = data.errors $.each(errors, function(key,value) { field = form.find('#' + value[0]); message = value[1]; field.addClass('is-invalid'); field.after('<div class="invalid-feedback">' + message + '</div>'); }); } else { alert("Une erreur s'est produite."); } } } else { alert("Une erreur s'est produite."); } }); e.preventDefault(); }); });
Code php : 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
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67 <?php $errors = []; $success = false; session_start(); require '../../inc/init.php'; if(isset($_SESSION['id'])) { $sql_user = 'SELECT * FROM users WHERE id = :id'; $requser = $pdo->prepare($sql_user); $requser->execute( [ 'id' => $_SESSION['id'] ] ); $user = $requser->fetch(); if(isset($_POST['email']) AND !empty($_POST['email']) AND $_POST['email'] != $user['email']) { $email = trim($_POST['email']); $pseudo = trim($_POST['pseudo']); if(filter_var($email, FILTER_VALIDATE_EMAIL)) { $sql_updateMembre = 'SELECT * FROM users WHERE email = :email OR pseudo = :pseudo'; $req_updateMembre = $pdo->prepare($sql_updateMembre); $req_updateMembre->execute( [ 'email' => $email, 'pseudo' => $pseudo ] ); //si le mail existe if($req_updateMembre->rowCount() == 0) { $sql_insertemail = 'UPDATE users SET email = :email WHERE id = :id'; $insertemail = $pdo->prepare($sql_insertemail); $insertemail->execute( [ 'email' => $email, 'id' => $_SESSION['id'] ] ); $success = true; }else { $selectMembre = $req_updateMembre->fetch(); if($selectMembre['email'] == $email) { array_push($errors, ['email', "L'adresse e-mail a déjà été utilisée"]); } elseif ($selectMembre['pseudo'] == $req_updateMembre) { array_push($errors, ['pseudo', "Le pseudo a déjà été utilisé"]); } } }else{ array_push($errors, ['email', "L'adresse e-mail n'est pas au bon format"]); } } } $return = [ 'success' => $success, 'errors' => $errors ]; die(json_encode($return)); ?>
Partager