Ce site utilise des cookies pour améliorer uniquement votre expérience utilisateur.
Vous pouvez lire à tout moment comment nous utilisons les cookies sur le site.
Bonjour mes chers codeurs,
Je travaille sur un modal avec une formulaire de contact à remplir (Nom, prénom, numéro téléphone, adresse et message) tout marche très bien avec PHP. Dans mon cas actuel si j'envoi le message le modal disparait.
A mon niveau j'aimerais voir en automatique le modal réapparaitre pour que je puisse savoir si le mail est envoyé.
Voir ci dessous le code.
Merci
<!-- Modal -->
<center>
<button style="background: #00ff2b; padding-top: 15px; padding-bottom: 15px; padding-left: 15px; padding-right: 15px; text-align: center; cursor:pointer; color: #000; font-weight:bold" onclick="document.getElementById('modal1').style.display='block'" style="width: auto; border-radius: 45px"><h4>Commander Maintenant</h4></button>
</center>
<div class="modal" id="modal1">
<form class="modal-content animate" action="#" method="POST" action="<?php $_SERVER['PHP_SELF'];?>">
<div class="img">
<span onclick="document.getElementById('modal1').style.display='none'" class="close" title="close Button">×</span>
<img src="img.jpg" alt="Avatar" class="avatar" style="position:relative; left: 40%">
</div>
<h3 style="position:relative; text-align:center">Je suis interessé(e) </h3>
<div class="containerr"> <div class="row">
<div class="col-lg-12 col-sm-12">
<div class="form-group">
<input type="text" name="firstname" id="firstname" class="form-control" placeholder="Votre NOM" value="<?php echo $firstname; ?>" />
<p class="comments"><?php echo $firstnameError ?></p>
</div>
</div>
<div class="col-lg-12 col-sm-12">
<div class="form-group">
<input type="text" name="name" id="name" class="form-control" placeholder="Votre Adresse" value="<?php echo $name;?>"/>
<p class="comments"><?php echo $nameError ?></p>
</div>
</div>
<div class="col-lg-12 col-sm-12">
<div class="form-group">
<input type="email" name="email" id="email" class="form-control" value="<?php echo $email;?>" placeholder="Votre EMAIL" />
<p class="comments"><?php echo $emailError ?></p>
</div>
</div>
<div class="col-lg-12 col-sm-12">
<div class="form-group">
<input type="text" name="phone" id="phone" class="form-control" placeholder="VOTRE Numero" value="<?php echo $phone;?>"/>
<p class="comments"><?php echo $messageError ?></p>
</div>
</div>
<div class="col-lg-12 col-md-12">
<div class="form-group">
<textarea name="message" class="form-control" id="message" cols="30" rows="5" required data-error="Ecrit votre message" ><?php echo $message; /*Pour faire reaparaitre les donnés de l'utilisateur apres envoie*/?>Je suis interessé</textarea>
<p class="comments"><?php echo $messageError ?></p>
</div>
</div>
<div class="col-lg-12 col-md-12">
<button type="submit" class="default-btn page-btn box-btn">
ENVOYER
</button>
<div id="msgSubmit" class="h3 text-center hidden"></div>
<div class="clearfix"></div>
</div>
</div>
<div class="containerr">
<button onclick="document.getElementById('modal1').style.display='none'" type="button" class="cancel">Annuler</button>
</div>
</div>
<p class="thank-you" style="display:<?php if($isSuccess) echo 'block'; else echo 'none';?>">Votre souscription a bien été envoyé. Merci de m'avoir contacté : </p>
</form>
</div>
Hello @Jerem971
Je viens d'apprendre pleins de choses actuellement entre "modal" et "pop-up".
La documentation c'est exactement ça que je recherchais. Sujet résolu.
Merci infiniment.
Hello @Aiman,
Attention à ne pas confondre "pop-up" et "modal" ! 🧐
Les fenêtres modales sont des fenêtres qui apparaissent directement à l’intérieur de la fenêtre courante du navigateur, au-dessus de la page web qui les appelle.
Il s’agit de fenêtres modales, c’est-à-dire de fenêtres qui prennent le contrôle de la page courante tant qu’elles sont affichées à l’écran.
Une pop-up est une autre fenêtre du navigateur qui s'affiche sur ton système d'exploitation et non directement sur la page web
Si certains sites utilisent le terme "pop-up", c'est tout simplement le mauvais terme, le bon terme est "modal" pour le développement web.
Pour ton problème, je pense que cet article pourrait t'aider 😉