Databases
StackOverflow2013
Postsdbo
PO
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>I did it by using JavaScript and tested in IE only as my requirement doesn't required all browser compatibility hence I didn't tested for other browser. </p> <p>The JavaScript function need to placed in the header (h:head) section if you are using template structure in the JSF2.0</p> <pre><code>&lt;script type="text/javascript"&gt; function ScrollPage(location) { window.location.hash=location; } &lt;/script&gt; </code></pre> <p>Create the anchor in page where you want to scroll or anchor the page</p> <pre><code>&lt;a id="anchorSecondPanel"&gt; </code></pre> <p>While clicking command button call this function on oncomplete event</p> <pre><code>oncomplete="ScrollPage('anchorSecondPanel')" </code></pre> <p>The complete modified code for xhtml is as below</p> <pre><code>&lt;h:form id="form1"&gt; &lt;p:panel header="Panel One" id="PanelOne" &gt; &lt;h:panelGrid styleClass="panelGrid" columns="2" id="PanelOneGrid" width="90%" &gt; &lt;h:outputText value="First Input Field Panel One" &gt;&lt;/h:outputText&gt; &lt;p:inputTextarea rows="20" cols="80"&gt;&lt;/p:inputTextarea&gt; &lt;h:outputText value="Second Input Field Panel One" &gt;&lt;/h:outputText&gt; &lt;p:inputTextarea rows="20" cols="80"&gt;&lt;/p:inputTextarea&gt; &lt;h:outputText value="" &gt;&lt;/h:outputText&gt; &lt;p:commandButton value="Click-me" update="form1" action="#{autoScrollBean.clickAction}" oncomplete="ScrollPage('FeatureMainPanel')"&gt; &lt;/p:commandButton&gt; &lt;/h:panelGrid&gt; &lt;/p:panel&gt; &lt;a id="anchorSecondPanel"&gt; &lt;p:panel header="Second One" id="PanelTwo" rendered="#{autoScrollBean.renderPanelTwo}"&gt; &lt;h:panelGrid styleClass="panelGrid" columns="2" id="PanelTwoGrid" width="90%" &gt; &lt;h:outputText value="First Input Field Panel Two" &gt;&lt;/h:outputText&gt; &lt;p:inputTextarea rows="20" cols="80"&gt;&lt;/p:inputTextarea&gt; &lt;h:outputText value="Second Input Field Panel Two" &gt;&lt;/h:outputText&gt; &lt;p:inputTextarea rows="20" cols="80"&gt;&lt;/p:inputTextarea&gt; &lt;/h:panelGrid&gt; &lt;/p:panel&gt; &lt;/h:form&gt; </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload