Discussion :

[charlux 64]

Bonjour


Je bloque sur une fonctionnalité toute simple.

Je voudrais à partir de l'action click sur un lien ouvrir une div dans une boite de dialogue.
Cette div ne doit pas être visible au chargement de la page.

J'ai donc essayé 2 solutions :

Premier essai :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
 
$(document).ready(function() {
 
	$("#divDialog").dialog({ 
   		    modal: true, 
    	            overlay: { 
	             opacity: 0.5, 
	             background: "black" 
	         } 
	    }).dialog("close");
 
 
	$("#lien").click(function(){
		$("#divDialog").dialog("open");
	});
 });

Cette solutions fait semblant de bien fonctionner :
au chargement de la page, les éléments html basiques (liens, checkbox ... ) ne sont plus cliquables.
Une fois que l'on a fait apparaître/disparaître la boite de dialogue, tout fonctionne normalement.
Que faire pour que les éléments de la page soient accessibles dès le chargement de celle-ci?



2nde tentative :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 
 
$(document).ready(function() {
 
	$("#divDialog").css("display","none");
 
 
	$("#lien").click(function(){
		$("#divDialog").dialog({ 
   		    modal: true, 
    	            overlay: { 
	             opacity: 0.5, 
	             background: "black" 
	         } 
	    });
	});
 
 });

Cette 2nde solution à pour problème que le lien n'est cliquable qu'une fois.
Au second click, la boite de dialogue n'apparait plus.


Je ne trouve pas de tutoriel poussé sur les widgets et je ne suis donc pas sûr d'utiliser les méthodes de Dialog à bon escient.

help! merci d'avoir lu ce post jusqu'au bout.

[Sourrisseau]

Salut ,

Je ne suis pas sur mais peut être que cela marche en modifiant la deuxième solution.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
 
 
 
$("#lien").click(function(){
		$("#divDialog").dialog({ 
   		    modal: true, 
    	            overlay: { 
	             opacity: 0.5, 
	             background: "black" 
	         } 
	    }).dialog("open");
	});

[charlux 64]

merci Sourrisseau

[bertrandm]

Pour éviter le chargement de la div au démarrage, il y aussi l'option autoOpen :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
$(document).ready(function(){
	$('#divDialog').dialog({
		autoOpen: false,
                modal: true, 
                overlay: {opacity: 0.5, background: "black"} 
                });
        $("#lien").click(function(){
		$("#divDialog").dialog("open");
	});
 });