web-dev-qa-db-fra.com

Bootstrap événement onload modal

Un mod bootstrap modal a-t-il un événement onload? Je veux appeler une requête http GET lorsque le modal est ouvert pour remplir le modal avec des données provenant d'une api de repos. J'ai un formulaire dans le modal et J'ai appelé la fonction GET sur l'événement onload du formulaire, mais cela ne fonctionne pas.

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title" id="myModalLabel">Agent details:</h4>
      </div>
      <div class="modal-body">

<form onload="getData()" style= "font-size: 16pt">
javascriptjquerytwitter-bootstrapevent-handlingbootstrap-modal
20
bookthief

Selon le documentation , vous pouvez écouter le spectacle ou les événements affichés.

De la documentation:

show.bs.modal => Cet événement se déclenche immédiatement lorsque la méthode show instance est appelée.

shown.bs.modal => Cet événement est déclenché lorsque le modal a été rendu visible à l'utilisateur (attendra la fin des transitions CSS).

$('#myModal').on('show.bs.modal', function () {
  // do something…
})
45
Dmase05

Ce que j'ai trouvé comme la meilleure façon de le faire, c'est d'ajouter l'attribut onclick à l'élément html qui appelle le modal.

<button type="button" onclick="PopulateAddModal()" class="btn btn-sm btn-primary" data-toggle="modal" data-target="#AddModal">Add</button>

Puis dans votre javascript ..

    function PopulateAddModal() {
      //do stuff here...
      }

Cela garantira que votre code est exécuté dès que le modal est appelé. Sinon, le code javascript ne fonctionnera pas tant que le modal n'aura pas complètement terminé son animation "fondue".

5
lbecker34