par

J'ai un premier Modal Bootsrap avec un bouton Suivant, je voudrais que lorsqu'on clic sur ce bouton, le premier Modal se ferme et que le second s'ouvre.

Voici le code des Modals :

<div class="modal" id="modal01" tabindex="-1" role="dialog">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title">Titre Modal 1</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <p>xxxxxxxxxxxx</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary">Suivant</button>
      </div>
    </div>
  </div>
</div>

<div class="modal" id="modal02" tabindex="-1" role="dialog">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title">Titre Modal 2</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <p>xxxxxxxxxxxx</p>
      </div>
      <div class="modal-footer">
         <button type="button" class="btn btn-secondary" data-dismiss="modal">Terminer</button>
      </div>
    </div>
  </div>
</div>

1 Réponse

+1 vote
par

Tu peux le faire avec JavaScript, tu ajoutes un id au bouton suivant :

id="suivant"

et ensuite:

<script type="text/javascript">
$("#suivant").click(function(){
  $('#modal01').modal('hide');
  $('#modal02').modal('show');
});
</script>

Tendances

Questions liées

Merci pour votre visite sur 1FORMATIK.com

Un petit clic sur la pub est toujours apprécié, c'est elle qui finance le site

Bon surf

...