Discussion :

[khaoula_14_05]

Bonsoir,

Je voudrais savoir comment ajouter un scroll vertical au composant dataTable.

Merci

[romaintaz]

On ne peut pas faire ça simplement...
J'ai 2 solutions à te proposer :

1. Tu entoures toute la datatable par un DIV (<h:panelGroup layout="block" ...>) où tu définis (en CSS) une hauteur donnée, et un overflow: auto. Le problème, c'est que toute la datatable est scrollable, pas seulement le contenu (hors entête donc).

2. Utiliser des composants particuliers qui le permettent, comme le scrollableDatatable de RichFaces.

[Fafhrd]

Bonjour, je suis sur le même problème.

J'ai testé la méthode de mettre dans une div mon composant pour faire apparaitre le scroller mais sans trop de résultat.

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
<h:panelGroup rendered="#{notificationHandler.notification}" id="notificationPanel"  
        layout="block" style="overflow: auto; height: 20px;">
    <rich:dataTable value="#{notificationHandler.dataModel}" var="notificationItem"   
            id="tableCourrier"
            width="100%" rows="10" columnClasses="columns,columns,columns" >
        <rich:column id="mylettranetNotificationDescription" width="400px">
              <h:outputText value="#{notificationItem.description}" />
        </rich:column>
    </rich:dataTable>
</h:panelGroup>

mon tableau est bien plus grand que mon panelGroup (car il a 3 lignes) mais malgré tout, aucun scroller n'apparait.

Je suis sous Firefox, je ne sais pas si ça a une incidence... si oui, comment faire ?

[Sniper37]

et avec:

Code :

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

style="overflow: scroll; height: 20px;"

[Fafhrd]

Merci pour cette réponse.

Avec overflow: auto, les scrollbars Horizontal et Vertical s'affichent en permanence.

J'ai réussi à limiter à la verticale en mettant overflow-y: scroll; mais cela ne répond pas entièrement à mon besoin car j'aurais aimé la voir disparaitre lorsqu'elle devient inutile.

[piopium]

tu peux faire ceci (c'est un peu tordu mais ça devrait marcher):
- déclarer 1 classe dans un fichier CSS avec overflow-y: scroll; (et d'autre chose si tu en as besoin)
- dans l'attribut styleClass tu peux mettre quelque chose du genre:

Code :

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

1
2
 
styleClass="#{monBean.condition==true ? maClassCss : '' }"

[Fafhrd]

Tu as raison, c'est tordu.

En fait dans ta solution, je retire la gestion du scrollbar de mon navigateur pour m'en occuper moi-même... pourquoi pas même si ça m'oblige à faire un traitement supplémentaire pour savoir quand je dois afficher ou non la scrollbar.

Je l'implémenterais si aucune autre proposition plus simple n'a été présentée.

En tout cas, tu m'auras appris qu'on peut faire des Conditionnelles en EL... ça je l'ignorais .

[piopium]

il me semble que cela est possible (en ce qui concerne l'opérateur ternaire) mais je n'en suis pas sûr à 100%, c'est à tester.
Ce dont je suis sûr c'est que tu peux utiliser des conditions dans les attributs tels que rendered tu peux avoir par exemple #{monBean.maCondition == true}.