Iframe après appui sur bouton
Résolu
Bonjour,
Je cherche un code permettant d'afficher une iframe après appui sur un bouton.
Je m'explique, j'ai un formulaire et lorsque la personne a cliqué sur envoyer je voudrais que l'iframe remplace le formulaire en affichant un truc du style merci pour votre réponse.
Je ne sais pas comment faire.
Auriez-vous une idée ?
Merci d'avance.
--
-insérez une citation bidon trouvée sur internet-
Je cherche un code permettant d'afficher une iframe après appui sur un bouton.
Je m'explique, j'ai un formulaire et lorsque la personne a cliqué sur envoyer je voudrais que l'iframe remplace le formulaire en affichant un truc du style merci pour votre réponse.
Je ne sais pas comment faire.
Auriez-vous une idée ?
Merci d'avance.
--
-insérez une citation bidon trouvée sur internet-
3 réponses
-
ContributeurBonsoir,
Pourquoi ne pas afficher simplement un message à la place du formulaire après validation. -
Contributeur'lut, pas besoin d'une iframe pour ça, juste d'un div avec le contenu.
Le mieux est même d'avoir le div présent dès le début endisplay: none
grâce à une classe CSS (cache
par exemple).
En JavaScript, il suffira d'enlever cette classe au div et de la mettre à ton formulaire, effectivement le remplaçant sur la page:document.getElementById('bouton-envoyer').addEventListener('click', function () { document.getElementById('formulaire').classList.add('cache'); document.getElementById('message-merci').classList.remove('cache'); }); -
J'ai trouvé une solution grace à Gravgun:
<script type="text/javascript">
function cacher()
{
document.getElementById('mail').style.display="none";
document.getElementById('merci').style.display="block";
document.getElementById('merci').className=className + "mail"
}
</script>
<div id="merci" style="display:none;" class="mail">
<div class="ss-q-help ss-secondary-text" style="text-align:center;">
Merci
</div>
</div>
<div id="mail" class="mail">
<form>
<input type="submit" name="submit" onclick="cacher()" value="Envoyer" id="ss-submit" class="jfk-button jfk-button-action "></td>
</form>
</div>
