OutPut text should expand by mouse click.

Question

Hi all.
I am displayings comments of a particular request in OutPut Text. i want to display these comments as follow
"your request is ap..." more by clicking "more" text should be expanded like below
"your request is approved" less
I am Using Jdeveloper 11.1.1.6.Please give me u r valuble suggestions.
Thanks,
Sai

Answer 1

You can use a af:switcher component for this like:
<af:panelGroupLayout id="pgl6">
                <af:switcher id="s1" facetName="#{viewScope.ToggleBean.truncateLength eq 0 ? 'LONG' : 'SHORT'}">
                  <f:facet name="SHORT">
                    <af:outputText value="outputText2 long test this is a long text sdfhkjsdh sdkfhsdhf fskhdf skh sjdj skdhf kshf fkjshd kshf kjshf skjhh ksjjh kjsdh kshf ksjhf kjshf ksfkjkh hksjdhf kjksdhff "
                                   id="ot7" truncateAt="#{viewScope.ToggleBean.truncateLength}" partialTriggers="cb6" noWrap="true"/>
                  </f:facet>
                  <f:facet name="LONG">
                    <af:panelGroupLayout id="pgl5" inlineStyle="width:250px;">
                      <af:inputText label="Label 1" id="it2"
                                    value="outputText2 long test this is a long text sdfhkjsdh sdkfhsdhf fskhdf skh sjdj skdhf kshf fkjshd kshf kjshf skjhh ksjjh kjsdh kshf ksjhf kjshf ksfkjkh hksjdhf kjksdhff outputText2 long test this is a long text sdfhkjsdh sdkfhsdhf fskhdf skh sjdj skdhf kshf fkjshd kshf kjshf skjhh ksjjh kjsdh kshf ksjhf kjshf ksfkjkh hksjdhf kjksdhff outputText2 long test this is a long text sdfhkjsdh sdkfhsdhf fskhdf skh sjdj skdhf kshf fkjshd kshf kjshf skjhh ksjjh kjsdh kshf ksjhf kjshf ksfkjkh hksjdhf kjksdhff "
                                    wrap="soft" readOnly="true" simple="true" rows="#{viewScope.ToggleBean.truncateLength eq 0 ? 5 : 1}" partialTriggers="cb6"/>
                    </af:panelGroupLayout>
                  </f:facet>
                </af:switcher>
                <af:commandButton id="cb6" text="#{viewScope.ToggleBean.buttonText}" action="#{viewScope.ToggleBean.toggleMode}"/>
              </af:panelGroupLayout>The bean is the same!
Timo