Panel Stretch Layout - Center facet needs to be adjustable

I am using JDev 11.1.1.3.0; building a public facing website.
I have set up the basic page layout with a Panel Stretch layout with facets at the top, center abd bottom. The top is the header, the bottom is the footer, the center is the content.
The payout needs to adjust based on how much content is contained within the center. Howeverm right now, that is not occuring. What is occuring is that if the content in the center exceeds the initial space, it creates a scoll bar.
I have the PSL contain set for a specific width. If I do NOT specify a height, it simply collapses. If I specify a width, taht width remains fixed.
Am I using the wrong container to define my variable content ?

wait a second here. I am confused.
When you have a normal web page, whether the content is contained within a <div> or a <table>, BOTH of those components strecth to allow the content flooding into them to show. If the content itself exceeds the height of a browser, the browser creates a scroll bar to allow the user to scroll up and down to vie wthe content. All very normal web protocol.
Here, the "PSL" comonent seems to do neither. I created a test page. It has nothing more than a PSL on it, with a TON of text I added in a <verbatim> tag and I put that in the center facet of the PSL.
Not only does the center facet NOT "push" the bottom facet down to reveal ALL of the content of the center div, (it just cuts right off mid-line) but if I remove the bottom facet, the broswer page does not stretch. the content simply runs off the page.
Why?
This should be MUCH easier than this. These ADF components are a joke. This is NOT web 2.0. What am I missing here? I want to design a simple web page where the center facet stretches top to bottom to grown with the content being added. This is my basic page layout:
<markup>
<af:panelStretchLayout startWidth="251px" id="pt_psl1"
endWidth="0px" inlineStyle="width:1000px;">
<f:facet name="start">
<f:subview id="sv2">
<jsp:include page="/fragments/home_side.jsff"/>
</f:subview>
</f:facet>
<f:facet name="center">
<af:panelStretchLayout id="pt_psl2" rendered="true"
startWidth="0px" endWidth="0px"
bottomHeight="0px" topHeight="99px">
<f:facet name="center">
<af:facetRef facetName="main"/>
</f:facet>
<f:facet name="top"><f:subview id="sv1">
<jsp:include page="/fragments/head_top.jsff"/>
</f:subview>
</f:facet>
<f:facet name="end"/>
</af:panelStretchLayout>

</f:facet>
</af:panelStretchLayout>
<af:panelStretchLayout id="footer_psl" topHeight="30px"
inlineStyle="width:1000px;height:30px;"
bottomHeight="0px">
<f:facet name="top">
<f:subview id="sv3">
<jsp:include page="/fragments/footer.jsff"/>
</f:subview>
</f:facet>
</af:panelStretchLayout>
</markup>
the facetref named "main" is where I am dragging portlets. Some of those portlets contain a little data, some contain a lot. Either way, the page needs to strectj to accomodate the data.
Can this even be DONE? If so, what am I missing?
Pat

Similar Messages

Panel Stretch Layout is not a valid child of PanelTabbed Component

With reference to the use case shown here(' [Table with Header Left,Footer Right|http://www.oracle.com/technetwork/testcontent/thlfrpattern-083015.html] ") :
I tried to embed the table inside the tabbed pane.
Here is the code for the same:
<f:view>
<af:document id="d1">
<af:form id="f1">
<af:panelSplitter id="ps1" orientation="vertical" splitterPosition="47">
<f:facet name="first"/>
<f:facet name="second">
<af:panelSplitter id="ps2" splitterPosition="144">
<f:facet name="second">
<af:panelTabbed id="pt1">

<af:showDetailItem text="Embedded in a Tab" id="sdi1"/>
<af:panelStretchLayout id="psl1" bottomHeight="31em" topHeight="62em" >
<f:facet name="bottom">
<af:panelStretchLayout id="psl2" endWidth="103em">
<f:facet name="end">
<af:panelGroupLayout id="pgl2" valign="middle" halign="end" layout="horizontal" >
<af:commandButton text="Save" id="cb1" accessKey="S"/>
<af:commandButton text="Cancel" id="cb2" accessKey="C"/>
<af:spacer width="6" height="31" id="s2"/>
</af:panelGroupLayout>
</f:facet>
</af:panelStretchLayout>
</f:facet>
<f:facet name="center">

</f:facet>
<f:facet name="top">
<af:panelGroupLayout id="pgl1" layout="horizontal">
<af:spacer width="6em" height="31em" id="s1"/>
<af:image source="/coffee.bmp" shortDesc="demo icon" id="i1"/>
<af:outputText value="List of Cool Employees" id="ot1"
inlineStyle="color:Black; font-weight:bold; font-size:large;"/>
</af:panelGroupLayout>
</f:facet>
</af:panelStretchLayout>
</af:panelTabbed>
</f:facet>
</af:panelSplitter>
</f:facet>
</af:panelSplitter>
</af:form>
</af:document>
</f:view>
Inside the PanelTabbed Component I cannot insert the PanelStretchLayout component.
The error it is displaying is that the Panel Stretch Layout is not a valid child of the PanelTabbed Component.
Please let me know how can I embed the 'Table with Header Left,Footer Right' in case of a PanelTabbed Component as shown in the use case in the documentation.

Hi,
Yes, children of af:panelTabbed must be af:showDetailItem - these represent each tab. You then add further components (e.g. your panelStretch, table etc.) as children to the af:showDetailItem.
Looking at your code, you have a showDetailItem but the panelStretch is not inside it. In fact nothing is inside the showDetailItem as the XML tag is self-closed (i.e. has a / at the end). You need to remove the / and add a closing tag (</af:showDetailItem) after your panelStretch.
Change your code to something like this:
<af:panelTabbed id="pt1">
<af:showDetailItem text="Embedded in a Tab" id="sdi1">
<af:panelStretchLayout id="psl1" bottomHeight="31em" topHeight="62em" >
</af:panelStretchLayout>
</af:showDetailItem>
</af:panelTabbed>Alternatively in the JDeveloper Structure view you could drag the panelStretch onto the showDetailItem so that it shows it as a child.
Kevin.

Panel Stretch Layout

Hi. I'm a begginer in ADF's and Jdeveloper and need some help.
If i have a Panel Stretch Layout and in the left facet i create a static menu with a pannel accordion and a panel list with some commandlinks, how can i show some info in the center facet qhen i click those commandlinks?
in my faces-config.xml i have a index.jspx and a secondary page page1.jspx joined by a gotopage1 JSF navigation case.
What i need is to click in the command link placed in the index.jspx page on the left facet of the panel strech layout and the result of clicking on it draws the page1.jspx in the center facet of the panel stretch layout.
Sorry about my english, hope someone can help me.
Thanks!

sycko,
There are a number of ways achieve what you describe. One method would be to set the rendered attribute on the panel you wish to render to "true" based on the selection in the left menu. In addition, you will need to set a partialPageTrigger on each panel. The trigger should identify the id of the link that should display the corresponding panel. The is probably the simplest approach.
--RiC

JDEV 11G R1 - Panel Stretch Layout

Hi,
I am using Jdev 11g R1. I would like to know how to set the size of the "Panel Stretch Layout" component to fit to the complete window.
Whenever I add it it just render on some part of the window and I have to change the width and height to set the size accordingly. But thats really weird.
Thanks,
Kamleshwar

have you tried inlineStyle="width:100%;height:100%;" ?

Panel Collection Status Bar Facet is not stretching properly

hi,
Panel Collection Status Bar Facet is not stretching properly
when we change the accessibility large font mode is
and change the browser text size as Largest.
thanks in advance

hi,
thanks for suggestion but I've already applied the AFStretchWidth styleClass.

Could not apply background image to the panel group layout in spaces application

I tried to apply background image to the panel group layout with css class and also with inline style such as below
background-image:url('/content/conn/intra-dot-content/path/mywebcenter/lever/backgroundmain.jpg');background-position:center; background-repeat:repeat-y;
The background image does not show up. but it work with panel border layout. Is there any work around for the issue

You can try styleclass, which is always better choice than inlinestyle
page:
<af:panelGroupLayout id="pgl30"
                                   styleClass="testPGbackground">
                <af:outputText value="outputText5" id="ot8"/>
              </af:panelGroupLayout>
css:
.testPGbackground {
    background-image:url('/images/unselectedTabStart.png');
It works for me.
I tried with inline style also and it worked.
bac
<af:panelGroupLayout id="pgl30"
                                   inlineStyle="background-image: url(/incview/images/unselectedTabStart.png);">
                <af:outputText value="outputText5" id="ot8"/>
              </af:panelGroupLayout>
NOTE: You need to mention image url with context-name here, which could be a way of hard coding context name and in future it could be very difficult to change contextname. As recommended styleclass is better solution.
Thanks
Sanjeev

Panel Grid Layout: Column Span unexpected behavior.

Whenever in a Panel Grid Layout, when i give a cell to span over multiple columns(2,3,4 or any), the cell is spanned over the entire row only.. Why does this behavior happens? In JDeveloper, the spanning is shown correctly in design tab and preview tab.

Hi Amanda,
I believe I have discovered the cause of the issue you are facing.
The problem is with the "Alert Region" region template and that it does not have any display points specified so indicate the number of grids that can fit in its region body. Without having any display points, the grid layout system attempts to use all columns available to its container. However, because the Alert Region has additional padding within, the columns will not fit and wrap to the next line.
To fix this issue, you will have to modify the "Alert Region" region template, go to "Display Points" and click Add Row. You will need to enter the following fields:
Name: Region Body
Template Substitution: BODY
Grid Support: Checked
Maximum Fixed Grid Columns: -1
This will fix the issue for you. I've logged a bug within our bug system to track this so we can fix it in a future release of APEX.
Best,
Shakeeb

Dynamic ht. of center facet of a panelStretchLayout depending on contents?

I have a customer who is using a panelStretchLayout for the content area of the page. They want the center facet to grow in height as child components differ from page to page. Is there a way to get the center facet to grow in height depending on its contents?
Thanks,
TheGoose
Edited by: TheGoose on May 30, 2012 12:31 PM

In the center facet for the panelStretchLayout - ensure that all the components are enclosed in a panelGroupLayout with layout set to vertical.
This would ensure height of panelStretchLayout is set depending upon the components inside it.
        <af:panelStretchLayout id="psl1" styleClass="AFStretchWidth">
          <f:facet name="bottom"/>
          <f:facet name="center">
            <af:panelGroupLayout id="pgl1" layout="vertical">
            </af:panelGroupLayout>
          </f:facet>
          <f:facet name="start"/>
          <f:facet name="end"/>
          <f:facet name="top"/>
        </af:panelStretchLayout>Thanks,
Navaneeth

Add grid rows in panel grid layout in adf UI page

I'm using panel grid layout in adf UI page. I need to add a dynamic grid row in panelGridLayout. Or in simple way programatically I need to add grid rows in panel grid layout in adf UI page.Timo Hahn Frank Nimphius Shay Shmeltzer-Oracle

Hi Shay,
It is a dynamic grid.
there can be one dropdown, two dropdown.... n dropdown.
Please tell me if there is any specific method to add children.

Align Components how a panel Form Layout

hi,
I have the panel form layout with components, fine perfect, but...
when I want to put a LOV such an output the text
the center together the alignment of the components is lost i have the picture :)
http://img100.imageshack.us/img100/7164/perfectoif.png
but i want put the output text join component , example:
http://img525.imageshack.us/img525/4543/asiquiero.png
the logic solution, i group component with panel group layout but the form i see:
http://img97.imageshack.us/img97/1096/erroryd.png
Any idea?? i use jdev 11.1.1.2
Joaquin
Edited by: ADFboy on 03-may-2010 10:54
Edited by: ADFboy on 03-may-2010 11:43

              <af:panelFormLayout id="pfl1" labelAlignment="start"
                                  maxColumns="2" rows="1">
                <af:panelGroupLayout id="pgl2" layout="horizontal"
                                     valign="bottom" halign="start"
                                     inlineStyle="text-align:left;">
                  <af:inputListOfValues label="ghdghd ghdghdf"
                                        popupTitle="Search and Result Dialog"
                                        id="ilov2"/>
                  <af:outputText value="outputText2" id="ot2"/>
                </af:panelGroupLayout>
                <af:inputListOfValues label="Label 1 fgs d"
                                      popupTitle="Search and Result Dialog"
                                      id="ilov1"/>
                <af:inputListOfValues label="Label 2"
                                      popupTitle="Search and Result Dialog"
                                      id="ilov4"/>
                <af:panelGroupLayout id="pgl1" layout="horizontal">
                  <af:inputListOfValues label="dghd ghdhd"
                                        popupTitle="Search and Result Dialog"
                                        id="ilov3"/>
                  <af:outputText value="outputText3" id="ot1"/>
                </af:panelGroupLayout>
                <af:inputListOfValues label="Label 3"
                                      popupTitle="Search and Result Dialog"
                                      id="ilov5"/>
                <af:inputListOfValues label="Label 4"
                                      popupTitle="Search and Result Dialog"
                                      id="ilov6"/>
                <af:inputListOfValues label="Label 5"
                                      popupTitle="Search and Result Dialog"
                                      id="ilov7"/>
                <af:inputListOfValues label="Label 6"
                                      popupTitle="Search and Result Dialog"
                                      id="ilov8"/>
              </af:panelFormLayout>

Stacking panel groups layout using a responsive design UI

Hi,
I am wondering if there is any way by using adf components, stretching, etc to accomplish what we can see in responsive web applications. For example, given a full screen you can see three panel groups layout next to each other, but if you reduce the size of the browser, the panel group should stack one on top of another. Anyone has done this? Any ideas?
Regards

hi rodrigo
schrene covered this very topic here: http://forums.adobe.com/message/5045627
i had pretty good success tweaking here sample file.
best,
keith

Issue while redisplaying .jpg for InlineStyle peroper of Panel Group Layout

Hi,
I have tried to use .JPG file for the InlineStyle property of Panel Group Layout(This is to be dispalyed as logo in my home page). The JPG image get dipslpayed when the .jspx (Home Page of my application) page is executed in the beginning. But the same imange is not appearing, once after moving to some task flow pages and coming back to same home page.
The place, where we are displaying this .jpg image remains empty when we navigate back to the same home page.
Kindly help at the earliest and also let me know if you need need more information to understand the issue.
Thanks and Regards
Sharavati
Edited by: user8763080 on Sep 30, 2010 4:44 AM

Hi Suganth,
Once again thanks, but let me tell you little more details on this.
Acutally my home page has got 4 options 1. Select Product 2. View Customers 3. View Orders 4. Place Order.
Out of 4 options first 3 are the popus defined and the logo gets displayed when we return to home page from the popup
Where as Place Order is the separate task (.jspx) is defined for the same. and logo is not getting displayed back, when we return from Place Order.
I tried the statment which you have give in the earlier reply, but the issue remains as it it.
Kindly help
Thanks and Regards
Sharavati

How to right align a read only numeric field in a panel form layout

Hi, does anyone know how to right align a read only numeric field in a panel form layout? I am using: Style Class = AFFieldNumberMarker, but it only seems to work if the field is disabled. Disabling the field gives it a difference appearance that does not look right on our forms. These are calculated fields, which cannot be modified, so read only is necessary.
I have looked online for some answers, and it seems that others are having similar issues.
I have tried different combinations for the properties, but so far I cannot get it to work.
Thanks
Judy
I am using JDEV 11.1.1.5

Sorry for the delay in my response. Here is the code
<af:inputText value="#{bindings.TotalAirlineCostEst.inputValue}"
label="#{bindings.TotalAirlineCostEst.hints.label}"
required="#{bindings.TotalAirlineCostEst.hints.mandatory}"
columns="#{bindings.TotalAirlineCostEst.hints.displayWidth}"
maximumLength="#{bindings.TotalAirlineCostEst.hints.precision}"
shortDesc="#{bindings.TotalAirlineCostEst.hints.tooltip}"
id="it20" readOnly="false"
disabled="true"
styleClass="AFFieldNumberMarker">
<f:validator binding="#{bindings.TotalAirlineCostEst.validator}"/>
<af:convertNumber groupingUsed="true"
pattern="#{bindings.TotalAirlineCostEst.format}"
type="number"
maxFractionDigits="0"/>
</af:inputText>
thank you,
Judy

Partial Trigger is not working with Panel Group Layout using ADF 11g.

Friends,
I have a requirment , Based on the <af:selectBooleanCheckbox> value I have to render <af:panelGroupLayout> dynamically. If the check box is checked then I have to display panel group layout otherwise not. The problem what I am facing here is Partial Trigger is not working, If I Un check the boolean box and refresh the page then I see it is working. If I don't refresh the page I am not seeing this is working as expected.
Below is the snippet
<af:selectBooleanCheckbox value="#{bindings.ChkBoolean.inputValue}"
shortDesc="#{bindings.OtherOptChk.hints.tooltip}"
id="OtherOpt" immediate="true" autoSubmit="true"
/>
<af:panelGroupLayout id="pgl11" partialTriggers="ChkBoolean"
rendered="#{bindings.ChkBoolean.inputValue}"">
Am I doing anything wrong here
Thanks in Advance

Hi,
I started to document common pitfalls like this. The problem has been reported last month too and is documented in here: http://www.oracle.com/technetwork/developer-tools/adf/learnmore/oct2010-otn-harvest-183714.pdf
Frank

Possible Bug: Rows & Column values are not honoured in panel form layout

                  <af:panelFormLayout id="pfl10"
                                                                                binding="#{backingBeanScope.backing_AssemblyStarts.pfl10}"
                                                                                rows="1" maxColumns="4"
                                                                                fieldWidth="66%" labelWidth="34%">
Even after Running, saving, deploying it shows the same 4 rows...
I wanted to include image as well... how to insert image in the question ? I drag and drop image on this editor, but it did not allow me to submit the question.
Here is the image I uploaded on google drive...
https://docs.google.com/file/d/0B7Po4hB-u4BgS3ExWG5YdjRIS1E/edit?usp=sharing
Thanks
Rahul

It is confirmed now...... I checked that this "Panel Form Layout" does not work on popup. It does not change rows and columns at all..... !!!!
It works fine on the normal page... but not on the popup.
Is it Bug or it is shortcoming of 'panel form layout' ???
Anybody listening ?? anybody faced this earlier ???
Thanks
Rahul

Panel Stretch Layout - Center facet needs to be adjustable

Similar Messages

Maybe you are looking for