web-dev-qa-db-fra.com

effectuer un basculement de données avec jquery

J'ai un bouton qui bascule un modal bootstrap.

<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">

Je veux faire la même chose avec une fonction jQuery. Est-ce possible?

jqueryhtml5twitter-bootstrap
10
Lord Vermillion

donne ton identifiant de bouton et cache-le:

CSS: 

#btnTrigger
{
display:none;
}

HTML: 

<button class="btn btn-primary btn-lg" id="btnTrigger" data-toggle="modal" data-target="#myModal">

et sur un autre événement ou condition, cliquez simplement dessus par programmation:

JQuery: 

$('#btnTrigger').click();

Dans Résultat, une fenêtre contextuelle sera affichée.

13
Ehsan Sajjad

Avec un code simple comme celui que vous avez posté:

<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">

Il n’affichera pas de dialogue modal sauf si vous écrivez du code en javascript comme:

$("button").on("click", function(){
  $($(this).attr("data-target")).modal("show");
});

Et ce que vous allez mettre dans data-target ouvrira un div avec id en tant que dialogue modal.

ou

$("button").on("click", function(){
  $($(this).data("target")).modal("show");
});
19
Snake Eyes

le code ci-dessous a fonctionné pour moi, vous pouvez appeler cette fonction sur n'importe quel événement

 <script type="text/javascript">
    $(document).ready(function () {
        ShowModel = function () {
            $("#myModal").modal();
        }
    });
</script>
5
sridharnetha

Juste un simple $("#myModal").modal() dans n'importe quelle fonction de votre choix

2
MKZ

Vous devriez peut-être lire cette explication à propos de l'attribut "data-" html5.

Vous pouvez définir des attributs de données personnalisés et les utiliser lors du développement de vos plugins.

C'est ce que bootstrap a fait.

Si vous souhaitez l’utiliser dans JQuery pour afficher une boîte de dialogue modale, vous devez écrire un plugin similaire à celui utilisé par bootstrap. 

Je vous suggère de lire le code source de bootstrap et de voir comment ils ont utilisé cet attribut.

0
Yaron