le scroll ne s'affiche pas avec le Viewport [Résolu]

[ninatity]

Bonjour,
Dans un des mes projets (consultation de matériels), j'ai utilisé un Viewport et j'ai mis un scrollbar à gauche. Il est constitué de plusieurs onglets dont quelques uns doivent s'afficher avec des scrollbar. Là ça marche bien mais dans un autre projet (redaction et lecture de textes), j'ai aussi utilisé un Viewport mais quand je veux mettre un scrollbar comme dans l'autre projet là c'est la catastrophe.
Plus rien ne s'affiche c'est-à-dire, il n'y a qu'une petite ligne bleue: mon FormPanel ne s'est pas déployé sur toute la longueur.

J'ai fait un

Code :

1
2
3
layout:'auto',
autoScroll:true,
forceLayout:true

dans le viewport.

Dans mon premier projet je n'ai que des onglets tandis que dans l'autre, j'ai un formpanel constitué d'un treepanel et de 2 onglets.
J'ai déjà aussi essayé layout:'border' mais le scrollbar ne s'affiche pas.
Avec layout:'fit', ce sont les scroolbar qui s'affichent mais pas le formpanel
Merci d'avance pour votre aide

[JulienFio]

Est-ce que tu as des erreurs qui ressortent dans la console d'erreurs de Firefox ?

[ninatity]

Non il n'y a pas d'erreurs que Firefox affichent. Firebug non plus n'affiche rien

[ninatity]

Voici une partie de mon code si ça peut aider

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
var tabpane = new Ext.TabPanel({activeTab:0,
items:[liste,fiche],
defaults:{autoHeight:true, bodyStyle:'padding:10px'}});
 
var form = {layout:'form',
width:'100%',
height:'100%',
border:false,
items:[tabpane]};
 
var corps = {region:'center',
title:'Notes',
items:[form]};
 
function deconnexion(){Ext.Msg.show({icon:Ext.Msg.QUESTION,
title:'Confirmation',
msg:'Voulez-vous vraiment vous déconnecter?',
buttons:{ok:'Oui',cancel:'Non'},
fn:function(id){if(id=='ok'){
 
		 //Destruction des cookies et redirection vers la page de connexion
		}}});}
 
Ext.onReady(function(){
Ext.BLANK_IMAGE_URL = 'ext/resources/images/default/s.gif';
Ext.QuickTips.init();
var idsession_val=' <span class="blue-bold">'+redacteur+'</span> -  <a id="disconnect" href="javascript:deconnexion()" class="red-bold">Se d&eacute;connecter</a>';
var idsession_pnl={region:'north',height:20,border:false,bodyStyle:'text-align:right;font-family:arial;font-size:.8em;padding:5px;',html:idsession_val};
 
var content = new Ext.FormPanel({region:'center',
layout:'border',
items:[menu,corps]});
 
new Ext.Viewport({layout:'border',
autoScroll:true,
forceLayout:true,
renderTo:Ext.getBody(),
items:[idsession_pnl,content]});
});

Là le Viewport s'affiche et prend la totalité de la page

Si je change en layout:'fit', des scrolls s'affichent à droite et en bas, le panel sur le redacteur et la déconnexion s'affiche mais pour le form rien

Si je change en layout:'auto' comme précédemment, le panel sur le redacteur et la déconnexion s'affiche mais le form n'est qu'une ligne bleue qui ne s'étend pas et évidemment, il n'y a pas de scroll

[takitano]

Bonjour,

Il n y a pas de scroll dans un viewport ... !
pkoi ? parceque l'intéret du viewport et de tout redimensionner en fonctoin de la taille de votre navigateur.

si vous souhaitez absoluement avoir un scroll, il faut opter pour un panel...

[ninatity]

Envoyé par takitano

Bonjour,

Il n y a pas de scroll dans un viewport ... !
pkoi ? parceque l'intéret du viewport et de tout redimensionner en fonctoin de la taille de votre navigateur.

si vous souhaitez absoluement avoir un scroll, il faut opter pour un panel...

Merci pour la précision. Je vais opter pour ça mais je me demande encore pourquoi ça a marché avec l'autre projet