Ouvrir le dialogue modal Jquery sur l'événement click

Le code ci-dessous fonctionne correctement pour le premier événement de clic. Cependant, pour tout clic ultérieur, rien ne se passe. J'ai testé ceci sur firefox, ie7 mais toujours pareil. Est-ce que je manque quelque chose?Ouvrir le dialogue modal Jquery sur l'événement click

<script type="text/javascript"> 
$(document).ready(function() { 
    //$('#dialog').dialog(); 
    $('#dialog_link').click(function() { 
     $('#dialog').dialog(); 
     return false; 
    }); 
}); 
</script>  
</head><body> 
    <div id="dialog" title="Dialog Title" style="display:none"> Some text</div> 
    <p id="dialog_link">Open Dialog</p> 
</body></html>

Source

2009-06-08 Sumanta

essayer

$(document).ready(function() { 
    //$('#dialog').dialog(); 
    $('#dialog_link').click(function() { 
     $('#dialog').dialog('open'); 
     return false; 
    }); 
});

il y a un arg ouvert dans la dernière partie

Source

2009-06-08 11:45:55

Désolé pas de chance :( Je mets une alerte ("kkh"), avant $ ('# dialogue') de dialogue();.. et il vient bien, mais pas de fenêtre encore – Sumanta

vérifier votre références sur le client, j'utilise firebug pour vérifier qu'il n'y a pas de 404s –

la boîte de dialogue charge sur le chargement de la page avant même l'événement de clic ... – user20358

Essayez cette

$(function() { 

$('#clickMe').click(function(event) { 
    var mytext = $('#myText').val(); 


    $('<div id="dialog">'+mytext+'</div>').appendTo('body');   
    event.preventDefault(); 

     $("#dialog").dialog({     
      width: 600, 
      modal: true, 
      close: function(event, ui) { 
       $("#dialog").remove(); 
       } 
      }); 
    }); //close click 
});

Et en HTML

<h3 id="clickMe">Open dialog</h3> 
<textarea cols="0" rows="0" id="myText" style="display:none">Some hidden text display none</textarea>

Source

2009-06-09 08:09:07 TigerTiger

Grande solution - J'ai aimé ça! – Guy

Ouais, la fonction .remove() est la réponse à mes malheurs. Quand j'appelais .close() c'était le problème. –

+1 Nice Solution Bro – RajeshKdev

$(function() { 

$('#clickMe').click(function(event) { 
    var mytext = $('#myText').val(); 

    $('<div id="dialog">'+mytext+'</div>').appendTo('body');   
    event.preventDefault(); 

     $("#dialog").dialog({     
      width: 600, 
      modal: true, 
      close: function(event, ui) { 
       $("#dialog").hide(); 
       } 
      }); 
    }); //close click 
});

Mieux vaut utiliser .hide() au lieu de .remove(). Avec .remove() il renvoie undefined si vous avez appuyé sur le lien une fois, puis fermez le modal et si vous appuyez à nouveau sur le lien modal, il renvoie undefined avec .remove.

Avec .hide() il ne fonctionne pas et il fonctionne comme un jeu d'enfant. Ty pour l'extrait dans la première main!

Source

2012-01-12 10:50:02

J'avais besoin de ceci dans mon code, merci de le signaler! – Charx

+1 pour une aide utile. :) – RajeshKdev

Si vous voulez mettre une page dans la boîte de dialogue, vous pouvez utiliser ces

function Popup() 
{ 
$("#pop").load('login.html').dialog({ 
height: 625, 
width: 600, 
modal:true, 
close: function(event,ui){ 
    $("pop").dialog('destroy'); 

     } 
}); 

}

HTML:

<Div id="pop" style="display:none;"> 

</Div>

Source

2012-04-20 07:11:14

Essayez d'ajouter cette ligne avant la ligne de dialogue.

$("#dialog").dialog("open");

Cette méthode a fonctionné pour moi. Il semble que la commande "close" rejette à nouveau l'ouverture du dialogue avec seulement le .dialog().

En utilisant votre code comme un exemple, il irait dans comme ceci (notez que vous devrez peut-être ajouter à votre code pour elle de donner un sens):

<script type="text/javascript"> 
$(document).ready(function() { 
    //$('#dialog').dialog(); 
    $('#dialog_link').click(function() { 
$("#dialog").dialog("open");   
$('#dialog').dialog(); 
     return false; 
    }); 
}); 
</script>  
</head><body> 
    <div id="dialog" title="Dialog Title" style="display:none"> Some text</div> 
    <p id="dialog_link">Open Dialog</p> 
</body></html>

Source

2013-04-13 19:08:29 dwlorimer

peut être utile ...:)

$(document).ready(function() { 
    $('#buutonId').on('click', function() { 
     $('#modalId').modal('open'); 
    }); 
});

Source

2016-01-13 09:36:05

Ouvrir le dialogue modal Jquery sur l'événement click

Répondre

Questions connexes