<?php

if ($_POST) {
    // le formulaire a été validé, on affiche la fenêtre modale via le code js ci-dessous
    echo "<script>$('#myModal').modal('show');</script>";

    // [...] suite de ton code avec vérification pseudo, mdp...

Salut,

Je vois au moins 2 solutions possibles :

Solution 1 : afficher la fenêtre modale après validation du formulaire
En validant le formulaire, la page est rechargée avec le message d'erreur ou de confirmation dans la fenêtre modale, tu peux alors utiliser javascript pour afficher automatiquement la fenêtre modale au chargement de la page si le formulaire a été validé :
[php]<?php

if ($_POST) {
// le formulaire a été validé, on affiche la fenêtre modale via le code js ci-dessous
echo "<script>$('#myModal').modal('show');</script>";

// [...] suite de ton code avec vérification pseudo, mdp...[/php]
(la fenêtre modale doit avoir l'attribut id="myModal")

Solution 2 : utiliser AJAX
Une autre solution consiste à utiliser ajax pour effectuer la validation du formulaire, la page ne sera ainsi pas rechargée et le message d'erreur ou de confirmation pourra être affiché dans la fenêtre modale dans le retour de la requête ajax.

Bonne journée

Personne n'a d'idée?
:(

Bonjour,

J'ai créé un popup d'inscription pour mon site, mais je souhaiterais que lorsque je clique sur "valider" mon popup ne se ferme pas et qu'il affiche en bas le message de succès ou d'erreur.
Là il l'affiche, mais comme il ferme le popup il faut recliquer dessus pour voir le message donc ce n'est pas très ergonomique ni intuitif.
Vous pouvez faire le test à l'adresse suivante [url]http://johannausinabia.com/artisans/[/url]
Et voici mon code du popup inscription
[code]<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
<h4 class="modal-title" id="myModalLabel">S'inscrire</h4>
</div> <!-- FIN modal-header -->

<div class="modal-body">
<form method="post" action="" accept-charset="UTF-8" class="form-horizontal">
<div class="col-sm-6">

<div class="control-group">
<label class="control-label" for="prenom">Prénom</label>
<div class="input-group champs-connexion">
<div class="input-group-addon icon-connexion">
<i class="fa fa-user"></i>
</div>
<input type="text" id="prenom" placeholder="Entrez votre prénom" class="form-control" name="prenom">
</div>
</div>

<div class="control-group">
<label class="control-label" for="nom">Nom</label>
<div class="input-group champs-connexion">
<div class="input-group-addon icon-connexion">
<i class="fa fa-user"></i>
</div>
<input type="text" id="nom" placeholder="Entrez votre nom" class="form-control" name="nom">
</div>
</div>

<div class="control-group">
<label class="control-label" for="email">Email</label>
<div class="input-group champs-connexion">
<div class="input-group-addon icon-connexion">
<i class="fa fa-envelope-o"></i>
</div>
<input type="email" id="email" placeholder="Entrez votre Email" class="form-control" name="email" required>
</div>
</div>

<div class="control-group">
<label class="control-label" for="metier">Métier</label>
<div class="input-group champs-connexion">
<div class="input-group-addon icon-connexion">
<i class="fa fa-briefcase"></i>
</div>
<input type="text" id="metier" placeholder="Entrez votre métier" class="form-control" name="metier">
</div>
</div>
</div> <!-- FIN col-sm-6 -->

<div class="col-sm-6">
<div class="control-group">
<label class="control-label" for="pseudo">Pseudo</label>
<div class="input-group champs-connexion">
<div class="input-group-addon icon-connexion">
<i class="fa fa-user"></i>
</div>
<input type="text" id="pseudo" placeholder="Entrez votre Pseudo" class="form-control" name="pseudo" required>
</div>
</div>

<div class="control-group">
<label class="control-label" for="mdp">Mot de passe</label>
<div class="input-group champs-connexion">
<div class="input-group-addon icon-connexion">
<i class="fa fa-key"></i>
</div>
<input type="password" id="mdp" placeholder="Entrez votre mot de passe" class="form-control" name="mdp" required>
</div>
</div>

<div class="control-group">
<label class="control-label" for="cp">Code postal</label>
<div class="input-group champs-connexion">
<div class="input-group-addon icon-connexion">
<i class="fa fa-map-marker"></i>
</div>
<input type="number" id="cp" placeholder="Code postale" class="form-control" name="cp">
</div>
</div>

<div class="control-group">
<p>
En vous inscrivant vous acceptez les <a href="#">conditions d'utilisation</a>
</p>
</div>
</div> <!-- FIN col-sm-6 -->
<button type="submit" name="valider" class="btn btn-success pull-right bleu-btn">
Connexion <i class="fa fa-chevron-right"></i>
</button>
</form>
</div> <!-- FIN modal-body -->
<div class="modal-footer modal-footer-connexion">
<?php
// traiter ce qui a été envoyé par le formulaire

if($_POST)
{

//affichageTableau($_POST);
$verifPseudo = preg_match('#^[a-zA-Z0-9.-_]+$#', $_POST['pseudo']);
if(!$verifPseudo) // 1) erreur : pb de caractères...
{
echo '<div class="erreur">Votre pseudo n\'est pas valide. Veuillez saisir des caractères autorisés.</div>';
$erreur = true;
}

if(strlen($_POST['pseudo']) < 5 || strlen($_POST['pseudo']) > 15) // 2) erreur : pb de taille...
{
echo '<div class="erreur">Votre pseudo doit comporter entre 5 et 15 caractères.</div>';
$erreur = true;
}
$resultat = $pdo->query("SELECT * FROM membrea WHERE pseudo = '$_POST[pseudo]' OR email = '$_POST[email]'");
if($resultat->rowCount() == 1) // 3) erreur : pseudo indisponible...
{
echo '<div class="erreur">Ce pseudo ou email est déjà utilisé.</div>';
$erreur = true;
}

if(!isset($erreur)) // si $erreur n'existe pas.
{
$_POST['mdp'] = md5($_POST['mdp']); // cryptage
// on insère
$pdo->query("INSERT INTO membrea (prenom, nom, email, metier, pseudo, mdp, cp, dateEnregistrement) VALUES ('$_POST[prenom]','$_POST[nom]','$_POST[email]','$_POST[metier]','$_POST[pseudo]','$_POST[mdp]','$_POST[cp]', NOW())");

echo '<div class="erreur-no">enregistrement ok.</div>';
}
}
?>
</div> <!-- FIN modal-footer -->

</div> <!-- FIN modal-content -->[/code]

Merci de vos suggestions pour arranger ce problème.