Requirement:
usually we come across this simple requirement
where we want to display certain component on certain value selected by user on
UI
E.g. I have drop down and based on selected
value either I want to display inputText field or inputDate field
Usually developer will add the partial
target on inputtext and inputdate field and will expect it to work with below
code
<af:form id="f1">
<af:spacer
height="100"></af:spacer>
<af:selectOneChoice autoSubmit="true"
id="tsk1" label="Select value"
unselectedLabel="--select--"
binding="#{CustomBean.ctask}">
<af:selectItem
label="Show input text"
value="test1"></af:selectItem>
<af:selectItem label="Show
input Date" value="test2"></af:selectItem>
</af:selectOneChoice>
<af:spacer
height="30"></af:spacer>
<af:inputText
required="#{CustomBean.ctask.value eq 'test1'}"
rendered="#{CustomBean.ctask.value
eq 'test1'}" partialTriggers="tsk1" id="inp1"
label="Input
Field 1"
binding="#{CustomBean.textBinding}"></af:inputText>
<af:inputDate
required="#{CustomBean.ctask.value eq 'test2'}"
rendered="#{CustomBean.ctask.value eq 'test2'}" partialTriggers="tsk1"
label="Input
Field 2"
binding="#{CustomBean.dateBinding}"></af:inputDate>
<af:spacer
height="30"></af:spacer>
<af:button
text="submit"></af:button>
</af:form>
But this doesn’t work and my input text
component doesn’t show up as we have applied render condition and not visible
condition on inputtext and inputdate component .
Reason for this is if you want to render
component at a runtime then you need to refresh parent layout component so I
added panelGrouplayout and partial trigger on the same and code will look like
below
<af:form id="f1">
<af:panelGroupLayout
partialTriggers="tsk1">
<af:spacer
height="100"></af:spacer>
<af:selectOneChoice autoSubmit="true"
id="tsk1" label="Select value"
unselectedLabel="--select--" binding="#{CustomBean.ctask}">
<af:selectItem
label="Show input text"
value="test1"></af:selectItem>
<af:selectItem
label="Show input Date"
value="test2"></af:selectItem>
</af:selectOneChoice>
<af:spacer
height="30"></af:spacer>
<af:inputText
required="#{CustomBean.ctask.value eq 'test1'}"
rendered="#{CustomBean.ctask.value eq 'test1'}"
partialTriggers="tsk1" id="inp1"
label="Input
Field 1"
binding="#{CustomBean.textBinding}"></af:inputText>
<af:inputDate
required="#{CustomBean.ctask.value eq 'test2'}"
rendered="#{CustomBean.ctask.value eq 'test2'}"
partialTriggers="tsk1"
label="Input Field
2" binding="#{CustomBean.dateBinding}"></af:inputDate>
<af:spacer
height="30"></af:spacer>
<af:button
text="submit"></af:button>
</af:panelGroupLayout>
</af:form>
And now my input text and input date
renders at runtime as below
This works in 12c but in 11g you will need
refresh the panelgrouplayout programmatically in value changeListener of select
one choice drodown using below statement
AdfFacesContext.getCurrentInstance().addPartialTarget(valueChangeEvent.getComponent().getParent());
