-
1. Re: dynamically show/hide or enable/disable controls based o
tynor Jul 18, 2007 8:30 AM (in response to tynor)Feedback please? Even if just to confirm that I'm trying to fit a square peg in a round hole by using richfaces/ajax4jsf for this functionality? Does this simple client-side toggling require pure Javascript rather than using these JSF libraries?
Thanks"tynor" wrote:
Seam 1.2.1-GA / facelets
Richfaces 3.0.1
Ajax4JSF 1.1.1
I am struggling to understand how to use richfaces and/or ajax4jsf to implement a togglable set of controls that are dynamically hidden or enabled/disabled based on the value of another control (e.g. when a checkbox is checked, display or enable a corresponding field; else don't).
I am trying to avoid customized JavaScript, however I've been unable to get the <a:support onclick/rerender> to cause my control to redisplay after clicking a checkbox.
This would seem to be a very simple "normally done in javascript, but abstracted by RichFaces or Ajax4JSF" sort of functionality. How is it intended to be done?
Here's what I've tried without success:<s:decorate id="thcheckboxDecoration" template="/layout/edit.xhtml"> <ui:define name="label">Checkbox</ui:define> <h:selectBooleanCheckbox id="theCheckbox" value="#{myHome.instance.someProperty}" > <a:support event="onblur" reRender="hasSsbicInvestmentDecoration"/> <a:support event="onclick" reRender="togglableGroup1,togglableGroup2"/> </h:selectBooleanCheckbox> </s:decorate> <!-- This one is intended to show/hide itself as the checkbox changes --> <h:panelGroup id="togglableGroup1" rendered="#{myHome.instance.someProperty}"> <s:decorate id="toggleableDecoration1" template="/layout/edit.xhtml"> <ui:define name="label">Show/Hide</ui:define> <h:inputText id="someText1" value="#{clientHome.instance.anotherProperty}"> <a:support event="onblur" reRender="someText1"/> </h:inputText> </s:decorate> </h:panelGroup> <!-- This one is intended to enable/disable itself as the checkbox changes --> <h:panelGroup id="togglableGroup2" <s:decorate id="toggleableDecoration2" template="/layout/edit.xhtml"> <ui:define name="label">Enable/Disable</ui:define> <h:inputText id="someText2" disable=#{!myHome.instance.someProperty}" value="#{clientHome.instance.yetAnotherProperty}"> <a:support event="onblur" reRender="someText2"/> </h:inputText> </s:decorate> </h:panelGroup>
-
2. Re: dynamically show/hide or enable/disable controls based o
sergeysmirnov Jul 18, 2007 11:26 AM (in response to tynor)Golden, brilliant (or what ever) rule - do not point with reRender to the component that has 'rendered' attribute. JSF renders nothing at the moment when rendered=true, so there is no placeholder in the DOM tree to insert a new content when rendered becomes true.
Second notes and again about 'rendered' - If rendered=false at the beginning of the decode phase, JSF will skip the decoding of the whole component content. I.e. in your example, if #{myHome} has a request scope and #{myHome.instance.someProperty}" equals false at the moment the bean is just created, you will have a big trouble for getting a value from the inner input components.
This is true for 'disable' attribute, BWT. if #{!myHome.instance.someProperty}" equals false at the beginning of the decode phase, you will not get the value of inputText id="someText2" -
3. Re: dynamically show/hide or enable/disable controls based o
tynor Jul 18, 2007 11:50 AM (in response to tynor)Thanks Sergey.
From this, I conclude that I should not try to use ajax4jsf or richfaces to dynamically toggle the disabled or display attributes of other fields -- I should just write a javascript onclick handler that twiddles the style and disabled attributes of those fields.
(correct me if I've misinterpreted you!) -
4. Re: dynamically show/hide or enable/disable controls based o
sergeysmirnov Jul 18, 2007 12:17 PM (in response to tynor)"The shortest way is a way you know well".