[JSF] [javascript] probleme avec la propriete disabled (Javascript) d'un bouton JSF

Hello,

Voici un petit probleme sur lequel je n'ai trouve aucune reponse, et dont personne ne c'est fait l'echo sur le Net.
Je cree un bouton dans ma page JSF:

Code:

---

1 2 3 4 5 6

<ui:button action="#{Cluster2.startNodeButton_action}" binding="#{Cluster2.startNodeButton}" disabled="#{Cluster2.isStartNodeButtonDisabled}" id="startNodeButton" style="left: 143px; top: 792px; position:absolute" text="Start Node"/>

---

Comme on peut le voir la propriete disabled est bindee.

Maintenant, ce que je veux faire, c'est de pouvoir controller egalement cette propriete disabled cote client. Cela entre dans le cadre plus general d'un rafraichissement de la page par Ajax. J'envoie une requete au serveur et il me renvoie un fichier XMl qui contient la liste de tous les composants graphiques avec les proprietes a modifier (style, disabled, ....).
Tout fonctionne sauf la modification de la propriete disabled du bouton.

En effet, si je met dans mon javascript qqchose du style

Code:

---

1 2 3 4 5 6 7

if (attrName == "disabled") { // Update the graying of the button if (webElement != null) { webElement.disabled = attrValue; } }

---

Alors:
- sous firefox, le bouton n'est pas grise mais n'est plus accessible (pas moyen de clicker dessus),
- sous IE6: le bouton est completement grise, meme si disabled=true.

J'ai essaye plusieurs methodes cote javascript comme:

Code:

---

1 2	sjwuic_assign_button(id, defaultButtonStrings, true, false, attrValue);

---

Cette methode ne donne rien, car le bouton est tjrs enabled.

Code:

---

1 2 3

webElement.removeAttribute("disabled"); webElement.setAttribute("disabled", attrValue);

---

La aussi rien de concluant!

Bref je seche. :aie:
A noter que sur un bouton purement HTML, cette propriete fonctionne, c'est pourquoi j'ai prefere poster sur le forum JSF.

Si tu veux mettre à jour le rendu HTML de composants JSF en utilisant ajax, je te conseille ajax4JSF, il fait passer, en ajax, les composant serveur par le cycle complet de requete, récupère le rendu des éléments qui ont "changé" et les réinjecte dans la page au bon endroit.


Modifier les propriétés disabled et readonly de composant JSF, en javascript, si tu cherche un peu, tu verra qu'on te dit partout que c'et "à ne pas faire" car meme si coté client le champ deviens éditable, tant que le composant est readonly coté serveur, il ne réagira pas et ignorera superbement ce que l'utilisateur en a fait.

pour la valeur du disabled, assure toi que tu lui passe bien une valeur de type "boolean" et non pas un string:


inputElement.disabled=true;
inputElement.disabled=false;

http://www.w3.org/TR/2003/REC-DOM-Le...ml#ID-50886781

Oups! :oops:
Effectivement je passais une string et pas un booleen.
Par contre, en utilisant le removeAttribute() et le setAttribute() avec un boolean, cela ne fonctionnait pas.

Code:

---

1 2 3 4 5 6 7

if (attrValue == "false") { webElement.disabled=false; } else { webElement.disabled=true; }

---

Merci beaucoup tchize_!

Sinon pour repondre a ta question, l'attribut disabled n'est pas readonly, donc on peut le modifier cote client.

Quand a l'utilisation d'ajax4jsf, je ne connais pas trop, et comme je reprends du code existant, je n'ose pas tout casser. Le souci principal de la servlet etait lors des campagnes Load&Stress. Le page est lourde a charger et a calculer, surtout lors des rafraichissement automatique (en effet la servlet appelle du code CORBA). Ma problematique a donc ete de faire des rafraichissements sans reconstruire tout l'arbre des composants a chaque fois (au pire c'etait toutes les 5s). J'intercepte donc la requete AJAX avant que la page soit en cycle render. Ainsi c'est le client qui travaille le plus :P
Si j'ai bien compris ton explication, avec ajax4jsf, on reconstruit quand meme l'arbre des composants?

Citation:

---

Envoyé par Sylobiwan

Sinon pour repondre a ta question, l'attribut disabled n'est pas readonly, donc on peut le modifier cote client.

---

C'est pas ce que j'ai dit, je dit juste que pour "disabeld" et "readonly", en JSF, toutes les docs disent que c'est à ne pas changer coté client. Car même si tu active un composant coté client avec du javascript, quand tu va soumettre coté serveur, les composant JSF disabled vont ignorer les valeurs soumises par le client, se basant sur leur status local. Bien sur, si tu adapte toi meme coté client et serveur simultanément, pas de problème :)

Citation:

---

Ma problematique a donc ete de faire des rafraichissements sans reconstruire tout l'arbre des composants a chaque fois (au pire c'etait toutes les 5s). Si j'ai bien compris ton explication, avec ajax4jsf, on reconstruit quand meme l'arbre des composants?

---

Honnêtement, à moins d'avoir 10.000 composants dans ton arbre, la recréation de l'arbre, c'est rapide, puisque créer l'arber jsf n'implique aucun valueBinding. Ajax4JSF recrée l'arbre. Là ou il dévie d'une soumission normale, c'est que tu peux lui préciser (via différent paramètres), de n'appliquer le cycle qu'à un ou plusieurs groupes de composants. Doncs les apply request value, les processDecode, les render n'auront lieu que pour ces composant (propriétés renderList et limitToList du ajax4jsf:commandButton). Ici on utilise çà pour accéler un formulaire complexe qui nécessite 5 secondes de rendu en temps normal, on limite la liste dans certaines zone, par exemple quand l'utilisateur lcique sur un bouton "ajouter une élément à la liste Y" :)

Bon en fait ca ne fonctionne pas tout a fait bien.
Sous Firefox, lorsque je change la propriete disabled pour la faire passer de true a false, le bouton reste grise mais on peut cliquer dessus. Meme chose pour passer de false a true. :cfou:
Je crois que je vais laisser tomber car je ne vois plus de solutions.

Sinon tchize_, effectivement, je maintiens a jour a la fois cote client et serveur les attributs qui sont modifies.
Et mon principal soucis dans la page Web, c'est une table de logs qui est bindee sur un dataprovider qui peut contenir (rapidement) plus de 50000 enregistrements. Or meme si tu n'affiches que les 10 1ers enregistrements, j'ai l'impression que toute la table est reconstuite a chaque fois (et c'est tres tres tres long).
Je te concede que c'est du HSQLDB, donc sans doute pas un modele de rapidite.

Apres reflexion, je pense maintenant qu'il s'agit d'un probleme de style.
les boutons JSF doivent avoir leur propre style, donc modifier la propriete disabled ne suffit pas, il faut egalement changer le style.
Je vais voir comment on peut faire (il faudrait surtout recuperer le style utilise par JSF).

Citation:

---

Envoyé par Sylobiwan

Et mon principal soucis dans la page Web, c'est une table de logs qui est bindee sur un dataprovider qui peut contenir (rapidement) plus de 50000 enregistrements. Or meme si tu n'affiches que les 10 1ers enregistrements, j'ai l'impression que toute la table est reconstuite a chaque fois (et c'est tres tres tres long).

---

Un dataTable qui afficherais les éléments 50 à 60, par exemple aurait besoin des éléments suivants:

Le composant Collection
sa taille
les éléments 50 à 60.

Le reste restera superbement ignoré par le dataTable.

J'en conviens, c'est pas pratique à coder, mais ta meilleure solution consiste peut-être à ce que ton Bean qui renvoie la collection, renvoie une implémentation custom de java.util.List, qui va, à chaque get(int index), récupérer une entrée de la db. De même, lors de l'appel à size(), va juste faire un select count(*) from mytable

Une autre solution serais de stocker çà dans un session bean, pour ne pas pomper la db à chaque fois.

J'ai enfin pu trouver comment faire.:yaisse2:
En fait, il a fallu, en plus de modifier la propriete disabled, modifier le style du bouton.
En effet les boutons JSF ont leur propre style (merci Firebug et Web Developer). Il faut donc, a chaque fois qu'on agit sur la propriete disabled, agir aussi sur la classe CSS associe.
Voici le code javascript qui fonctionne:

Code:

---

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

if (webElement != null) { if (attrValue == "false") { if (webElement.disabled == true) { webElement.disabled=false; webElement.className='Btn2'; sjwuic_assign_button(id, defaultButtonStrings, true, false, false); } } else { if (webElement.disabled == false) { webElement.disabled=true; webElement.className='Btn2Dis'; sjwuic_assign_button(id, defaultButtonStrings, true, false, true); } }

---

:yaisse2:

En fait mon soucis etait plutot du javascript, mais ca sera peut etre utile a d'autres personnes travaillant sur du JSF.

Merci tchize_ pour tes conseils.
Pour le datatable, malheureusement je n'ai plus le temps de tout modifier, mais c'est vrai quon aurait du faire comme cela. C'est le soucis d'etre un debutant sur une techno ;)