Composants de taille calculée dynamiquement

Bonjour,

Je cherche à faire un composant comme ceci avec JSF :

http://uploads.imagup.com/07/1231330027_histo.png

J'ai essayé en mode verbatim :

Code:

---

1 2 3 4 5 6

<f:verbatim> <div class="unhandled" style="width: #{table.nbUnhandled}px;">#{table.nbUnhandled} %</div> <div class="unsynchronizable" style="width: #{table.nbUnsynchronizable}px;">#{table.nbUnsynchronizable} %</div> <div class="synchronizable" style="width: #{table.nbSynchronizable}px;">#{table.nbSynchronizable} %</div> <div class="synchronized" style="width: #{table.nbSynchronized}px;">#{table.nbSynchronized} %</div> </f:verbatim>

---

Erreurs :

• avec des #{...} : #{..} is not allowed in template text
• avec des ${...} : Unable to load class for JSP

Puis j'ai essayé avec Tomahawk :

Code:

---

1 2 3 4

<t:div styleClass="unhandled" style="width: #{table.nbUnhandled}px;">#{table.nbUnhandled} %</t:div> <t:div styleClass="unsynchronizable" style="width: #{table.nbUnsynchronizable}px;">#{table.nbUnsynchronizable} %</t:div> <t:div styleClass="synchronizable" style="width: #{table.nbSynchronizable}px;">#{table.nbSynchronizable} %</t:div> <t:div styleClass="synchronized" style="width: #{table.nbSynchronized}px;">#{table.nbSynchronized} %</t:div>

---

Erreurs :

• avec des #{...} : #{..} is not allowed in template text
• avec des ${...} : According to TLD or attribute directive in tag file, attribute style does not accept any expressions

Voyez-vous une solution pour réaliser ce composant graphique, qui nécessite de calculer dynamiquement la taille des différentes sections ?

Merci.

Bonjour,

Quelques idées :

Te mettre à Facelets, qui acceptera de faire ce que tu veux.
Utiliser le <h:panelGroup layout="block" .../> pour créer un DIV (attention à bien mettre layout="block", sinon il te créera un span).

Je viens d'essayer, et hélas l'erreur est la même qu'avec Tomahawk. :/

Je pense qu'il faut un outputtext dans la div

Code:

---

1 2 3 4

<t:div styleClass="unhandled" style="width: #{table.nbUnhandled}px; "> <h:outputtext value="#{table.nbUnhandled} %"/> </t:div>

---

ou bien

Code:

---

1 2 3 4

<t:div styleClass="unhandled" style="#{'width: '+table.nbUnhandled+'px; '}"> <h:outputtext value="#{table.nbUnhandled} %"/> </t:div>

---

ou bien

Code:

---

1 2 3 4

<h:panelGroup layout="block" style="#{'width: '+table.nbUnhandled+'px; '}"> <h:outputtext value="#{table.nbUnhandled} %"/> </h:panelGroup>

---

VG.

Je suis pas sur que c'est ce que tu veux !!!

Tu peux faire un panelgrid avec 4 colonnes, chaque colonnes aura comme with le pourcentage que tu veux.

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17

<machin:panelgrid columns="4" width="100%"> <machin:panelgroup style="width:#{table.nbUnhandled}%"> <machin:outputText value="#{table.nbUnhandled} %"/> </machin:panelgroup>   <machin:panelgroup style="width:#{table.nbUnsynchronizable}%"> <machin:outputText value="#{table.nbUnsynchronizable} %"/> </machin:panelgroup>   <machin:panelgroup style="width:#{table.nbSynchronizable}%"> <machin:outputText value="#{table.nbSynchronizable} %"/> </machin:panelgroup>   <machin:panelgroup style="width:#{table.nbSynchronized}%"> <machin:outputText value="#{table.nbSynchronized} %"/> </machin:panelgroup> </machin:panelgrid>

---

peut etre j'ai zappé qlq chose mais l'idée et la