Discussion :

[VinceCBA]

Bonjour à tous,

Je me suis créé un p'tit dialog custom avec un div vide par défaut, que je rempli à mon bon vouloir (grâce a du XHR), mais selon le contexte, je voudrai modifier sa taille.

Par défaut j'ai ca :

Code html :

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
<s:div id="dialogCustom"
       data-dojo-type="dijit.Dialog"
       data-dojo-props="title : 'Fiche information',
       draggable: false,
       focused: true,
       onHide: function(){ 
       this.set('title','Fiche information'); 
       this.reset();
       destroyAllWidgets('contentCustom');
       document.getElementById('contentCustom').innerHTML = '';
       document.getElementById('contentCustom').refresh();
       }"
       cssStyle="display:none; min-width: 400px; max-width: 850px; max-height:800px; background-color: #FFF; position: fixed;">
 
    <s:div id="contentCustom" cssStyle="max-height:425px; overflow-y: auto; overflow-x: hidden;"></s:div>
</s:div>

Code :

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

destroyAllWidgets('contentCustom'); // Fonction qui détruit tous mes widget Dojo dans le div

Code :

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

 this.reset() / document.getElementById('contentCustom').innerHTML = '' / document.getElementById('contentCustom').refresh(); // Vide mon div et réinitialise le dialog et le div

Mon problème concret est le suivant :
J'ai un appel qui ressemble à ca dans un contexte particulier :

Code :

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

1
2
3
dijit.byId('dialogCustom').set('style', 'width:500px;');
document.getElementById('contentCustom').style.maxHeight = '455px';
showDialog('dialogCustom');"

Le problème est que si je décide de ré-ouvrir un "dialogCustom" par la suite dans un autre contexte, il gardera une largeur de 500px, et son div "contentCustom" un max-height de 455px, ce qui me gène donc.

J'ai essayé de repasser des valeurs dans le "onHide" de mon dialog pour remettre le style par défaut (avec des : this.set('style', 'width : 600px') etc...) mais rien n'y fait.
Par défaut mon dialog n'a pas de width prédéfini, mais un min et max-width (il s'adaptera donc a la taille de son contenu).

Ma question est simple : comment faire pour réinitialiser complètement un dialog et que celui-ci reprenne sa config de création svp ?

[emmanuel.remy]

Salut,

Essaie:

Code :

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

1
2
 
dijit.byId('dialogCustom').resize();

ou applique tes styles explicitement sur le containerNode de ton Dialog.

Normalement on n'a pas besoin de toucher aux largeur et hauteur, elles sont calculées automatiquement par dojo selon le contenu du dialog (en appliquant par exemple des "auto")

ERE

[VinceCBA]

Salut, merci pour ta réponse,

ou applique tes styles explicitement sur le containerNode de ton Dialog.

C'est a dire ?

[emmanuel.remy]

Salut,

Chaque dijit dispose d'un domNode qui correspond à ta div englobante pour le dialog. Ce dernier dispose par ailleurs d'un containerNode qui correspond à la div qui héberge le contenu du dialog. C'est certainement ce noeud là qu'il faudrait tester pour tes styles.

Qlq chose comme:

Code :

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

1
2
 
dijit.byId('dialogCustom').containerNode.set('style',.....);

ERE

[VinceCBA]

Salut,

Merci pour tes propositions, mais en placant tes commandes dans les onHide() (et meme onShow() ), ca n'a pas l'air de fonctionner ... :/

Peut etre que je m'y suis mal pris ?

Code :

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

1
2
3
4
5
6
7
8
9
10
onHide: function(){ 
       this.set('title','Fiche information'); 
       this.reset();
       destroyAllWidgets('contentCustom');
       document.getElementById('contentCustom').innerHTML = '';
       document.getElementById('contentCustom').refresh();
       this.resize();
// OU
       this.containerNode.set('style', 'max-width: 850px; max-height:800px;');
       }