Messages flash sur la même page.....

Par flodereims02, il y a 8 ans


Bonjour,

Je suis face à un problème...

Comment vous feriez pour récuperer les erreurs de votre formulaire ? j'ai essayé plusieurs choses, mais à chaque fois il y a toujours un truc qui ne pas va.... je m'explique

Dans les grandes lignes, j'ai mon traitement PHP et formulaire HTML sur index.php , je créer mon tableau d'erreurs $errors = []; et ensuite dans les différents IF je met $errors['nom'] = "Nom invalide" etc.... et dans la partie HTML je place :

<?php if(!empty($errors)): ?> <div class="flash flash-danger"> <?php foreach($errors as $error): ?> <?= $error; ?><br> <?php endforeach; ?> </div> <br> <?php endif; ?>

et il me liste les différentes erreurs dans une div que j'ai créer, le problème, c'est que j'ai besoin une fois que le formulaire est validé et donc qu'il y a des erreurs, de retourner au niveau de mon formulaire (qui est placé vers le milieu de ma page avec un ID 1 sur la balise form), mais je ne peux pas faire de header('Location:index.php#1'); car le message ne s'affiche pas sinon.... etant donné qu'il recharge la page...
Auriez vous un truc pour contourner ce problème ?

J'ai bien essayé la solution des $_SESSION['flash'] avec le tuto de Grafikart , ça marche à peu près bien, mais le problème c'est comment lister toute les erreurs (donc foreach) dans ce code ci au niveau de la div flash :

<?php class Session { public function __construct() { session_start(); } public function setErrors($message, $type) { $_SESSION['flash'] = array( 'message' => $message, 'type' => $type ); } public function errors() { if(isset($_SESSION['flash'])) { ?> <div id="flash" class="flash flash-<?= $_SESSION['flash']['type']; ?>"> <?= $_SESSION['flash']['message']; ?> <button type="button" class="close" aria-label="Close"> <span aria-hidden="true">&times;</span> </button> </div> <br> <?php unset($_SESSION['flash']); } } }

Merci d'avance....

Cordialement......

3 réponses

Mehdikacim, il y a 8 ans

Par AJAX ?

Arbi, il y a 8 ans

il faut pas mellanger entre les message flash et les erreur de forulaire separer les choses
apres dans les erreur cree juste un tableau assoc
example: [
'email' => 'not valid',
'nom' => 'not valid'
]

apres il faut parcourir ca

flodereims02, il y a 8 ans

Bonsoir,
J'ai retrouvé ceci, un petit code HTML / PHP / AJAX, que j'ai épuré au maximum.... le problème c'est que les erreurs sont toute mises en dessous des inputs, mais est il possible par rapport à ce code, de mettre toute les erreurs dans une div au dessus ?
J'y arrive en temps normal mais là avec AJAX impossible... :(
J'ai d'ailleurs remis dans le HTML mon foreach de $errors et le $errors = []; dans le PHP, ainsi que $errors['prenom'] = "Text" dans le IF du prénom, mais ça ne marche pas..... sauriez vous pourquoi ?
Cordialement.
Voici les codes:

Index.php

<!DOCTYPE html> <html> <head> <title>Contactez-Moi !</title> <meta charset="utf-8"/> <meta name="viewport" content="width=device-width, initial-scale=1"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> <link href='http://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="css/style.css"> <script src="script.js"></script> </head> <body> <div class="container"> <div class="divider"></div> <div class="heading"> <h2>Contactez-moi</h2> </div> <div class="row"> <div class="col-lg-10 col-lg-offset-1"> <form id="contact-form" method="post" action="" role="form"> <?php if(!empty($errors)): ?> <div style="color: red;"> <?php foreach($errors as $error): ?> <?= $error; ?><br> <?php endforeach; ?> </div> <br> <?php endif; ?> <div class="row"> <div class="col-md-6"> <label for="prenom">Prénom <span class="blue">*</span></label> <input id="prenom" type="text" name="prenom" class="form-control" placeholder="Votre prénom"> <p class="comments"></p> </div> <div class="col-md-12"> <input id="submit" type="submit" class="button1" name="submit" value="Envoyer"> </div> </div> </form> <div id="success">Votre message à bien été envoyé.</div> </div> </div> </div> </body> </html> <style> #success { display: none; } </style>

Contact.php

<?php $array = array("prenom" => "", "prenomError" => "", "isSuccess" => false); $errors = []; if ($_SERVER["REQUEST_METHOD"] == "POST") { $array["prenom"] = $_POST["prenom"]; $array["isSuccess"] = true; if(empty($_POST["prenom"])) { $errors['prenom'] = "UN PRENOM VALIDE !"; $array["prenomError"] = "Je veux connaitre ton prénom !"; $array["isSuccess"] = false; } if($array["isSuccess"]) { } echo json_encode($array); } ?>

Script.js (AJAX)

$(function () { $('#contact-form').submit(function(e) { e.preventDefault(); $('.comments').empty(); var postdata = $('#contact-form').serialize(); $.ajax({ type: 'POST', url: 'contact.php', data: postdata, dataType: 'json', success: function(json) { if(json.isSuccess) { $('#success').show(); // message de confirmation d'envoi $('#contact-form').hide(); } else { $('#prenom + .comments').html(json.prenomError); } } }); }); })