Panel Tabbed with regions

Hi
I have Panel Tabbed with two items inside - both contains regions inside (static - not dynamic).
        <af:panelTabbed id="pt1" partialTriggers="t1">
          <af:showDetailItem text="Item 1" id="s1">
            <af:region value="#{bindings.emp.regionModel}" id="r1"/>
          </af:showDetailItem>
          <af:showDetailItem text="Item 2" id="s2">
            <af:region value="#{bindings.dept.regionModel}" id="r2"/>
          </af:showDetailItem>
        </af:panelTabbed>Logging initializers and finelizers for task flows inside these regions I noticed that both are triggered when I enter on the page with Panel Tabbed. Only task flow on selected item should be loaded - em I right ? Is there any property to set "loading on demand" regions in Panel Tabbed ?
Kuba

Hi,
depends on the JDeveloper version you are on. For example, you can set a task flow binding (in pageDef) to deferred loading in which case it does what you want it to do. Early JDeveloper 11g R1 releases did not have this feature, in which case the behavior is as you see it. So you may need to check your JDeveloper version, and if it is an upgraded JDeveloper 11g application, check the deferred setting on the task flow binding
Frank

Similar Messages

  • Panel Tabbed Inter-Region Communication - jdev 11.1.2.3

    Hello:
    I have a page with panel tabbed.  In each showDetailItem (TAB) there is a bounded task flow (BTF from ADFLib) that needs to receive employeeID.
    The employeeID is used as a bind variable for each VO query shown in the tab. When the user clicks on a new tab, I want to receive the employeeID
    in the BTF and set the bind variable in the VO and then let the BTF  execute the query so when the tab doscloses it shows the VO results based on the new employeeID.
    Note: it is the clicking of a tab that should accept the employeeID and set the bind variable so when the VO executes it correctly displays the results of the query in the newly opened tab.   Currently I am using BTF Input Parameters to get the employeeID, which works ok. But how do I set the VO bind variable to the new employeeID before the BTF executes?  Note: I know how to set VO bind variables with:
    getParmsMap().put(bindVar, employeeID)
    which I tried setting in the BTF Initializer. But this does not work. It seems ADF is processing somehow and does not like when I try to process my query within it's normal ADF lifecycle of disclosing the tab.
    So when a new tab is selected to be opened, I need to accept the new employeeID, set the bind variables of the VO, before the ADF lifecycle kicks in to display the newly opened tab.  When the tab is finally displayed by ADF, the VO query results should show the results based on the new employeeID.
    How can I make this happen?
    Any articles or sample code would be greatly appreciated.
    Thanks much.

    bump!

  • Render a  region in panel tabbed with condition

    Hi,
    Am using jdeveloper 11.1.1.6.0.,
    I have 2 jsff regions emp.jsf and dept.jsf ., I have main.jspx page which has two buttons emp and dept buttons. When my user clicks the emp button welcome.jspx renders which has 2 tabs emp tab and dept tab.
    While my user clicks the emp button the emp tab should be shown to the user., If it is dept button then dept tab should be shown.
    Main.jspx Emp ----------->  welcome.jspx (Emp Tab).
    Main.jspx Dept ------------> welcome.jspx (Dept Tab).
    No task flows have been used.
    Regards,
    Prasad K T,
    9840021070.

    Hm, you are changeing pages, in this case you have to write the selected tab in a pageFlowScope variable instead of a viewScope variable.
    This is the code:
    Welcome page
                <af:panelTabbed id="pt1">
                  <af:showDetailItem text="Dep" id="sdi1" disclosed="#{empty pageFlowScope.selTab ? true : pageFlowScope.selTab eq 'dep'}">
                    <af:table value="#{bindings.DepartmentRo.collectionModel}" var="row" rows="#{bindings.DepartmentRo.rangeSize}"
                              emptyText="#{bindings.DepartmentRo.viewable ? 'No data to display.' : 'Access Denied.'}"
                              fetchSize="#{bindings.DepartmentRo.rangeSize}" rowBandingInterval="0"
                              selectedRowKeys="#{bindings.DepartmentRo.collectionModel.selectedRow}"
                              selectionListener="#{bindings.DepartmentRo.collectionModel.makeCurrent}" rowSelection="single" id="t2" styleClass="AFStretchWidth">
                      <af:column sortProperty="#{bindings.DepartmentRo.hints.DepartmentName.name}" sortable="true"
                                 headerText="#{bindings.DepartmentRo.hints.DepartmentName.label}" id="c8">
                        <af:outputText value="#{row.DepartmentName}" id="ot7"/>
                      </af:column>
                      <af:column sortProperty="#{bindings.DepartmentRo.hints.ManagerId.name}" sortable="true"
                                 headerText="#{bindings.DepartmentRo.hints.ManagerId.label}" id="c6">
                        <af:outputText value="#{row.ManagerId}" id="ot9">
                          <af:convertNumber groupingUsed="false" pattern="#{bindings.DepartmentRo.hints.ManagerId.format}"/>
                        </af:outputText>
                      </af:column>
                      <af:column sortProperty="#{bindings.DepartmentRo.hints.LocationId.name}" sortable="true"
                                 headerText="#{bindings.DepartmentRo.hints.LocationId.label}" id="c7">
                        <af:outputText value="#{row.LocationId}" id="ot8">
                          <af:convertNumber groupingUsed="false" pattern="#{bindings.DepartmentRo.hints.LocationId.format}"/>
                        </af:outputText>
                      </af:column>
                    </af:table>
                  </af:showDetailItem>
                  <af:showDetailItem text="Emp" id="sdi2" disclosed="#{empty pageFlowScope.selTab ? false : pageFlowScope.selTab eq 'emp'}">
                    <af:table value="#{bindings.Employees.collectionModel}" var="row" rows="#{bindings.Employees.rangeSize}"
                              emptyText="#{bindings.Employees.viewable ? 'No data to display.' : 'Access Denied.'}" fetchSize="#{bindings.Employees.rangeSize}"
                              rowBandingInterval="0" filterModel="#{bindings.EmployeesQuery.queryDescriptor}"
                              queryListener="#{bindings.EmployeesQuery.processQuery}" filterVisible="true" varStatus="vs"
                              selectedRowKeys="#{bindings.Employees.collectionModel.selectedRow}"
                              selectionListener="#{bindings.Employees.collectionModel.makeCurrent}" rowSelection="single" id="t1" styleClass="AFStretchWidth">
                      <af:column sortProperty="#{bindings.Employees.hints.EmployeeId.name}" filterable="true" sortable="true"
                                 headerText="#{bindings.Employees.hints.EmployeeId.label}" id="c5">
                        <af:outputText value="#{row.EmployeeId}" id="ot4">
                          <af:convertNumber groupingUsed="false" pattern="#{bindings.Employees.hints.EmployeeId.format}"/>
                        </af:outputText>
                      </af:column>
                      <af:column sortProperty="#{bindings.Employees.hints.FirstName.name}" filterable="true" sortable="true"
                                 headerText="#{bindings.Employees.hints.FirstName.label}" id="c3">
                        <af:outputText value="#{row.FirstName}" id="ot3"/>
                      </af:column>
                      <af:column sortProperty="#{bindings.Employees.hints.LastName.name}" filterable="true" sortable="true"
                                 headerText="#{bindings.Employees.hints.LastName.label}" id="c1">
                        <af:outputText value="#{row.LastName}" id="ot2"/>
                      </af:column>
                      <af:column sortProperty="#{bindings.Employees.hints.Email.name}" filterable="true" sortable="true"
                                 headerText="#{bindings.Employees.hints.Email.label}" id="c4">
                        <af:outputText value="#{row.Email}" id="ot6"/>
                      </af:column>
                      <af:column sortProperty="#{bindings.Employees.hints.PhoneNumber.name}" filterable="true" sortable="true"
                                 headerText="#{bindings.Employees.hints.PhoneNumber.label}" id="c2">
                        <af:outputText value="#{row.PhoneNumber}" id="ot5"/>
                      </af:column>
                    </af:table>
                  </af:showDetailItem>
                </af:panelTabbed>
    and Main page
                <af:panelGroupLayout id="pgl1">
                  <af:commandButton text="emp" id="cb1" action="go">
                    <af:setPropertyListener from="#{'emp'}" to="#{pageFlowScope.selTab}" type="action"/>
                  </af:commandButton>
                  <af:commandButton text="dep" id="cb2" action="go">
                    <af:setPropertyListener to="#{pageFlowScope.selTab}" from="#{'dep'}" type="action"/>
                  </af:commandButton>
                </af:panelGroupLayout>
    Timo

  • Cannot use the same page template in panel tabbed

    Hi,
    I have a panel tabbed with region in each tab. And all the jsff uses the same pageTemplate, but the jsff displays only a blank with no error . So I apply refresh condition on the Region thinking it might be the cause, initially the two region loaded successfully but when I switch back to the first tab it throws Exception
    <RegistrationConfigurator><handleError> Server Exception during PPR, #1
    java.lang.NullPointerException
    at oracle.adfinternal.view.faces.taglib.region.IncludeTag$RelocatedFacet.restoreFacet(IncludeTag.java:900)
    at oracle.adfinternal.view.faces.taglib.region.IncludeTag.doStartTag(IncludeTag.java:200)
    at oracle.adfinternal.view.faces.taglib.region.DynamicIncludeTag.doStartTag(DynamicIncludeTag.java:109)
    With my investigation it shows that same pageTemplate cannot be used in panel tabbed. What seems to be the solution here? Or Am I lacking something on reusing pageTemplate across panel tabbed?
    Thanks in advance.

    Hi..
    I think this is the not error with pages created with the page template.But may be cause some contents in the page.
    anyway you will helpful following link
    Re: How to resolve Server Exception during PPR, #16 ?
    http://andrejusb.blogspot.com/2008/04/record-split-into-table-and-form.html

  • Panel Tab issue with mandatory fields

    So i have a requirement where i have Jsff page with paneltab and 2 showdetail, on one show detail i further ave panel tab with 5 show detail.
    when i commit data on one tab its asking for other tab Mandatory fields and commitng the all tab data.
    I did immediated=true on all tab, but it didnt help.
    Can someone please help me onthis.
    Thnks
    RJ

    Jaspal
    Correct i have two level of tabs
    Tab1 Tab2
    under tab 2
    Tab21,Tab22,Tab23,Tab24,Tab25
    Tab21-tab25 have there own Taskflows which used differnt VO(based on diff EO) and 1-2 tab will have Trasient VO
    So Tab 1 has Updatable VO with some mandatory Fields. When i come to screen i saw two tabs Tab1 and Tab2
    I clcik on Tab 2 i saw Tab 21-25...When i commit some data on Tab21, its asking for mandatory fields of Tab1
    I hope i am clear..let me know if you need some other info
    Thanks for help
    RJ

  • Help on Panel tabbed component

    Hi everybody,
    i have a panel tab with two show detail items in it.
    on first show detail item, i have a button - when click should show second show detail item.
    Can any help how to do this from a bean?
    Thanks
    KM.

    Hi,
    you can programatically disclose/close showdetailitem. see this http://www.youritbox.com/index.php?option=com_content&view=article&id=801&Itemid=399
    ~Abhijit

  • Region in panel tabbed throws exception

    hi!
    I have a Jsff page with a panel tabbed having two showDetailItem and each showDetailItem has region. Both region activation property is set to Conditional with corresponding EL for Active attribute. The region in first tab is loaded succesfully, and same thing with the region in the second tab. But when I get back to the first tab I got this Exception
    <RegistrationConfigurator><handleError> Server Exception during PPR, #1
    java.lang.NullPointerException
         at oracle.adfinternal.view.faces.taglib.region.IncludeTag$RelocatedFacet.restoreFacet(IncludeTag.java:900)
         at oracle.adfinternal.view.faces.taglib.region.IncludeTag.doStartTag(IncludeTag.java:200)
         at oracle.adfinternal.view.faces.taglib.region.DynamicIncludeTag.doStartTag(DynamicIncludeTag.java:109)
    All the backing beans of the regions are in request scope.

    I had isolated the problem, it is not the region.. it's the pageTemplate so I post another thread for this.
    Cannot use the same page template in panel tabbed

  • Panel Tabbed within dynamic region

    Hi Every body
    I have 3 dynamic region each region has a panel Tabbed when run the page the first region work fine when navigate between tabs (af:showDetailItem) , the second region it does't work when navigate between tabs it's like frozen just first tab (af:showDetailItem) open and the same thing with the third region ?
    any help?!
    I'm using JDev 11.1.1.3.0

    Hi,
    the managed bean that holds the dynamic region TaskFlowId is in backing bean scope by default. Change the bean scope to viewScope and also change all the EL references to the bean accordingly (on the page and the task flow binding in the PageDef file)
    Frank

  • Spry tabbed panels, opening a tabbed panel,  problem with IE

    i've have made a site, with tabbed panels,
    all the pages are made of a template;
    everythings works fine; in Firefox and Opera,
    but only in IE when i open a tabbed panel from a menubar, the contents  is opened behind my header location;
    i've used spry 1.6.1 and spryUtils to open the tabbed panel.
    because there no other posibilty to open  a tabbed panel from my other page.
    i've tested the site on CSS and all, and i've don't get any errors.
    this site is only on our intranet, and DVD;
    so is not a online site
    i' dont have anything modified in the java script.
    just changed some minor adjustments to the CSS of the tabbed panels
    The page is containing a fixed footer and header, FOR all browsers therefore is the CSS IE hacks also.
    and all other functions work normal.
    i'm only a beginner at this
    CSS
    body,html {
        margin: 0;
        padding: 0;
        height: 100%;
        width: 100%;
    body{
        color: #000;
        background-attachment: fixed;
        background-image: url(../afbeeldingen/Sitepictures/HaupteingangPB.jpg);
        font-family: Arial, Helvetica, sans-serif;
        font-size: 95%;
    #img2 {
        height: 2cm;
        width: 2cm;
        border:0;
    #img {
        margin-right: 10px;
        height: 3cm;
        width: 3cm;
        border:0;
    TD{
        font-family: Arial;
        font-size: 8pt;
        line-height: normal;
        vertical-align: top;
        text-align: left;
    #header-wrap {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 5;
    #header-container {
        height: 120px;
        background-repeat: repeat-x;
        background-position: left bottom;
    #header {
        width: 1040px;
        margin: 0 auto;
        position: relative;
    #header-content{
        width: 1040px;
        position: relative;
        background-image: url(../afbeeldingen/Sitepictures/background.jpg);
        margin-top: 0;
        margin-right: auto;
        margin-bottom: 0;
        margin-left: auto;
    #header ul li {
        float: left;
        margin-right: 2px;
    #container {
        width: 1040px;
        padding-top: 120px;
        padding-bottom:50px;
        background-color: #FFF;
        margin-bottom: 0px;
        left: auto;
        right: auto;
        margin-right: auto;
        margin-left: auto;
        position: relative;
        height: auto;
        min-height:100%;
    #container a:link {
        color: #00C;
        text-decoration: none;
    #container a:visited {
        color: #F8495A;
        text-decoration: none;
    #container a:hover {
        color: #00C;
        text-decoration: underline;
    #container a:active {
        color: #00B004;
        text-decoration: none;
    #kolommaker
        width:1040px;
        background-color: #CEECAE;
        height: 100%;
        float: left;   
    #boven {
        width: 1040px;
        position: static;
        height: 180px;
        background-color: #FFF;
    #sitecontent {
        width: 1040px;
        background-color: #FFF;
        height: 100%;
    #TabbedPanels1 {
        width: 1040px;
        position: static;
        background-color: #FFF;
        height: 100%;
        float: left;
    .links, .rechts, .midden {
        height:100%;
        display: inline-table;
        background-color: #FFF;
    .links{
        float: left;
        width: 330px;
        font-size: 12px;
        padding-top: 5px;
        margin-top: 0px;
        margin-right: auto;
        margin-left: auto;
    .rechts{
        padding-top: 5px;
        float: right;
        width: 330px;
        text-align: left;
        font-size: 12px;
        margin-top: 0px;
        margin-right: auto;
        margin-left: auto;
    .midden{
        padding-top: 5px;
        width: 330px;
        text-align: left;
        font-size: 12px;
        margin-top: 0px;
        margin-right: auto;
        margin-left: auto;   
    #footer-wrap {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        z-index: 5;
    #footer-container {
        height: 50px;
        background-image: url(../images/footer-bg.png);
        background-repeat: repeat-x;
        background-position: left bottom;
    #footer {
        width: 1040px;
        margin: 0 auto;
        position: relative;
        background: #FFF;
    #contentfooter {
        width: 1040px;
        margin-top: 0;
        margin-right: auto;
        position:relative;
        margin-bottom: 0;
        margin-left: auto;
        height:50px;
        border-top-width: 1px;
        border-top-style: solid;
        border-top-color: #F00;
        text-align: center;
    .leftfooter {
        float: left;
    .rightfooter {
        float: left;
    #iframe {
            height: 600px;
            min-height: 600px; }
    .result_title a:link {
        color: #00C;
        text-decoration: none;
    .result_title a:visited {
        color: #F8495A;
        text-decoration: none;
    .result_title a:hover {
        color: #00C;
        text-decoration: underline;
    .result_title a:active {
        color: #00B004;
        text-decoration: none;
    .description { font-size: 100%; color: #008000; }
    .docs {border:0;}
    .pdf {border:0;}
    .images {border:0;}
    .excell {border:0;}
    .exe {border:0;}
    .clock {
        text-align: center;
        background: #FFF;
        border: 1px solid #CCC;
        height: 20px;
        width: 175px;
        font-size: 12px;
    .clearfix {
        content:".";
        width:100%;
        height: 0;
        clear: both;
        display: block;
        visibility: hidden;
    /* Hides from IE-mac \*/
    .clearfix {height: 1%;}  /* for IE/Mac */
    CSS IE hacks
    html{
        overflow: hidden;
    body{
        overflow: auto;
    #header-wrap, #footer-wrap {
        position: absolute;
    #header-container, #footer-container,{
    margin-right: 16px;
    #ie6-container-wrap {
        position: absolute;
        width: 100%;
        height:100%;
        overflow:auto;
    #TabbedPanels1 {
        position: absolute;
    .TabbedPanels {
        position: absolute;
    #boven {
        padding-top: 100px;
    #container {
        padding-top: 60px;
        height :100%;
    #sitecontent {
        height: 100%;
    #footer-wrap {
        bottom: -1px;
    #header img, #footer img
    display: block;
    Template
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <!-- TemplateBeginEditable name="doctitle" -->
    <title>Naamloos document</title>
    <!-- TemplateEndEditable -->
    <!-- TemplateBeginEditable name="head" -->
    <!-- TemplateEndEditable -->
    <link href="../Stijlbladen/main4.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" type="text/css" href="../Stijlbladen/pro_dropdown_3.css"/>
    <script src="../SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
    <script type="text/javascript" src="../SpryAssets/SpryURLUtils.js"></script>
    <script type="text/javascript">var params = Spry.Utils.getLocationParamsAsObject(); </script>
    <link href="../SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
    <script src="../Scripts/stuHover.js" type="text/javascript"></script>
    <script type="text/javascript" src="../Scripts/percentageProgressBar.js"></script>
    <script type="text/javascript" src="../Scripts/paswoord.js"></script>
    <!--[if lt IE 7 ]>
    <link href="../Stijlbladen/ie6hacks.css" rel="stylesheet" type="text/css" />
    <![endif]-->
    </head>
    <body>
    <!--ZOOMSTOP-->
    <div id="header-wrap">
        <div id="header-container">
            <div id="header">
                    <div id="header-content">
                    <table width="890" border="0" cellspacing="1">
          <tr>
            <td width="100" height="50"><a href="../Sites/Index.html"><img src="../afbeeldingen/Sitepictures/WN_OriginalImage.jpg" width="90" height="50"/></a></td>
            <td width="680">
         <span class="preload1"></span>
        <span class="preload2"></span>
            <ul id="nav">
                <li class="top"><a href="#nogo2" id="Algemeen" class="top_link"><span class="down">Algemeen</span></a>
                    <ul class="sub">
                    <li><b>Alg. Procedure</b></li>
                    <li><a href="#nogo3" class="fly">Car Policy</a>
                        <ul>
                            <li><a href="../Algemeen/CAR POLICY WN_dec2009.doc">Carpolicy NL</a></li>
                            <li><a href="../Algemeen/CAR POLICY WNdec2009FR.doc">Carpolicy FR</a></li>
                        </ul>
                    </li>
                    <li><a href="#nogo7" class="fly">Gsm Policy</a>
                        <ul>
                            <li><a href="#nogo8">Gsm Policy NL</a></li>
                            <li><a href="#nogo9">Gsm Policy FR</a></li>
                        </ul>
                    </li>
                    <li><b>Diversen</b></li>
                    <li><a href="../Algemeen/Skills.htm">Skills</a></li>
                    <li><a href="../Sites/Verlof-Recup.html">Verlof</a></li>
                    <li><a href="../Sites/Verlof-Recup.html">Recup</a></li>
            </ul>
                </li>
                <li class="top"><a href="#nogo2" id="Support" class="top_link"><span class="down">Support</span></a>
                    <ul class="sub">
                        <li><a href="../Algemeen/support/Artikellijst.xls">ArtikelLijst</a></li>
                        <li><a href="../Algemeen/support/Retail Algemeen.xls">Retail Algemeen</a></li>
                        <li><a href="../Algemeen/support/Barcodes v2-2.pdf">Barcode's ALL</a></li>
                        <li><a href="../Algemeen/support/CRM 2.2.pdf">CRM 2.2</a></li>
                        <li><a href="#nogo7" class="fly">Onkostennota</a>
                        <ul>
                            <li><a href="../Algemeen/dbourdon_1109.xls">Onkostennota NL</a></li>
                            <li><a href="../Algemeen/décompte de frais July 2009.xls">Onkostennota FR</a></li>
                        </ul>
                        </li>
                        <li><a href="#nogo7" class="fly">Online Tools</a>
                        <ul>
                            <li><a href="file://///Wincor-nixdorf/projects/BE/D34POOL/STOCK MAALBEEK/FIELD/PLOMPEN RETAIL LOC WB.xls">Stock E.Plompen</a></li>
                            <li><a href="../Sites/login.html">Online map</a></li>
                            <li><a href="../Sites/Fujitsu.html">Fujitsu Portal</a></li>
                        </ul>
                    </li>
                         <li><a href="#nogo7" class="fly">FAX Franchisé</a>
                        <ul>
                            <li><a href="../Algemeen/support/Fax franchisé NL4.doc">Franchisé NL</a></li>
                            <li><a href="../Algemeen/support/Fax franchisé FR4.doc">Franchisé FR</a></li>
                        </ul>
                        </li>
            </ul>
        </li>
        <li class="top"><a href="#nogo22" id="Contacts" class="top_link"><span class="down">Contacts</span></a>
            <ul class="sub">
                <li><a href="../Algemeen/contacts/technician.pdf">Retail Tech</a></li>
                <li><a href="../Algemeen/contacts/telretail.xls">Tel Ret/Helpdesk</a></li>
                <li><a href="../Algemeen/contacts/Telefoonlijst WN + WNS.xls">Tel WN/WNS</a></li>
            </ul>
        </li>
        <li class="top"><a href="#nogo27" id="Klanten" class="top_link"><span class="down">Klanten</span></a>
            <ul class="sub">
                <li><a href="../Sites/Aldi.html">Aldi</a></li>
                <li><a href="../Sites/Little Customers.html?tab=0#tabbedpanels1">Belgique Loisirs</a></li>
                <li><a href="../Sites/Bonita.html">Bonita</a></li>
                <li><a href="../Sites/Carrefour.html">Carrefour</a></li>
                <li><a href="../Sites/C&amp;A.html">C &amp; A</a></li>
                <li><a href="../Sites/Decathlon.html">Decathlon</a></li>
                <li><a href="../Sites/Delhaize.html">Delhaize</a></li>
                <li><a href="../Sites/Ici Paris XL.html">Ici Paris</a></li>
                <li><a href="../Sites/Ikea.html">Ikea</a></li>
                <li><a href="../Sites/Little Customers.html?tab=3#tabbedpanels1">Koodza</a></li>
                <li><a href="../Sites/Kruidvat.html">Kruidvat</a></li>
                <li><a href="../Sites/Lidl.html">Lidl</a></li>
                <li><a href="../Sites/Living Tomorrow.html">Living Tomorrow</a></li>
                <li><a href="../Sites/Mediamarkt.html">Mediamarkt</a></li>
                <li><a href="../Sites/Scapino.html">Scapino</a></li>
                <li><a href="../Sites/Little Customers.html?tab=2#tabbedpanels1">Takko</a></li>
                <li><a href="../Sites/Little Customers.html?tab=1#tabbedpanels1">Texto</a></li>
            </ul>
        </li>
        <li class="top"><a href="#nogo63" id="ThirdParty" class="top_link"><span class="down">3th Party</span></a>
            <ul class="sub">
                <li><a href="../Sites/third party.html?tab=5#tabbedpanels1">Fujitsu Siemens</a></li>
                <li><a href="../Sites/third party.html?tab=4#tabbedpanels1">HP</a></li>
                <li><a href="../Sites/third party.html?tab=6#tabbedpanels1">Datalogic</a></li>
                <li><a href="../Sites/third party.html?tab=7#tabbedpanels1">Vensafe</a></li>
                <li><a href="../Sites/third party.html?tab=1#tabbedpanels1">Scanners</a></li>
                <li><a href="../Sites/third party.html?tab=0#tabbedpanels1">Scales</a></li>
            </ul>
        </li>
        <li class="top"><a href="../Sites/Wincor-Nixdorf materiaal.html" id="WN-Material" class="top_link"><span>WN-Material</span></a></li>
        <li class="top"><a href="../Sites/Technician tools.html" id="Techtools" class="top_link"><span>Techtools</span></a></li>
    </ul>
            </td>
          </tr>
        </table>
      <table width="1038" border="0" cellspacing="1">
      <tr>
        <td><form method="get" action="../indexer/search.html">
    <input type="text" name="zoom_query" size="30" />
    <input type="submit" value="Search" />
    </form></td>
        <td> </td>
        <td><div class="clock"><script type="text/javascript" language="javascript" src="../Scripts/datetime.js">
    </script></div>
    </td>
      </tr>
    </table>
             </div>
            </div>
        </div>
    </div>
    <!--ZOOMRESTART-->
    <div id="ie6-container-wrap" >
    <div id="container">   
            <!-- TemplateBeginEditable name="EditRegion1" -->
         <div id="boven">test<br />
           <br />
         </div> 
         <div id="TabbedPanels1" class="TabbedPanels">
          <ul class="TabbedPanelsTabGroup">
            <li class="TabbedPanelsTab" tabindex="0">Algemeen</li>
            <li class="TabbedPanelsTab" tabindex="0">Tools</li>
            <li class="TabbedPanelsTab" tabindex="0">Pc's</li>
            <li class="TabbedPanelsTab" tabindex="0">Kassa's</li>
            <li class="TabbedPanelsTab" tabindex="0">Selfscanning</li>
            <li class="TabbedPanelsTab" tabindex="0">Self Check Outs</li>
            <li class="TabbedPanelsTab" tabindex="0">EN andere</li>
          </ul>
          <div class="TabbedPanelsContentGroup">
            <div class="TabbedPanelsContent">
              <div class="links">Hier wordt de inhoud voor  id left weergegeven</div>
              <div class="rechts">Hier wordt de inhoud voor  id right weergegeven</div>
              <div class="midden">Hier wordt de inhoud voor  id midden weergegeven
                <p>Hier wordt de inhoud voor  id midden weergegeven</p>
                <p> </p>
                <p> </p>
                <p> </p>
                <p> </p>
                <p> </p>
                <p> </p>
                <p> </p>
                <p> </p>
                <p> </p>
                <p> </p>
                <p> </p>
                <p> </p>
                <p> </p>
                <p> </p>
              </div>
            </div>
            <div class="TabbedPanelsContent">
              <div class="links">Hier wordt de inhoud voor  id left weergegeven</div>
              <div class="rechts">Hier wordt de inhoud voor  id right weergegeven</div>
              <div class="midden">Hier wordt de inhoud voor  id midden weergegeven</div>
            </div>
            <div class="TabbedPanelsContent">
              <div class="links">Hier wordt de inhoud voor  id left weergegeven</div>
              <div class="rechts">Hier wordt de inhoud voor  id right weergegeven</div>
              <div class="midden">Hier wordt de inhoud voor  id midden weergegeven</div>
            </div>
            <div class="TabbedPanelsContent">
              <div class="links">Hier wordt de inhoud voor  id left weergegeven</div>
              <div class="rechts">Hier wordt de inhoud voor  id right weergegeven</div>
              <div class="midden">Hier wordt de inhoud voor  id midden weergegeven</div>
            </div>
            <div class="TabbedPanelsContent">
              <div class="links">Hier wordt de inhoud voor  id left weergegeven</div>
              <div class="rechts">Hier wordt de inhoud voor  id right weergegeven</div>
              <div class="midden">Hier wordt de inhoud voor  id midden weergegeven</div>
            </div>
            <div class="TabbedPanelsContent">
              <div class="links">Hier wordt de inhoud voor  id left weergegeven</div>
              <div class="rechts">Hier wordt de inhoud voor  id right weergegeven</div>
              <div class="midden">Hier wordt de inhoud voor  id midden weergegeven</div>
            </div>
            <div class="TabbedPanelsContent">
              <div class="links">Hier wordt de inhoud voor  id left weergegeven</div>
              <div class="rechts">Hier wordt de inhoud voor  id right weergegeven</div>
              <div class="midden">Hier wordt de inhoud voor  id midden weergegeven</div>
            </div>
            <div class="TabbedPanelsContent">
              <div class="links">Hier wordt de inhoud voor  id left weergegeven</div>
              <div class="rechts">Hier wordt de inhoud voor  id right weergegeven</div>
              <div class="midden">Hier wordt de inhoud voor  id midden weergegeven</div>
            </div>
          </div>
          <div class="clearfix:after"> </div>
    </div>
    <!-- TemplateEndEditable -->
        </div>
        <div class="clearfix:after"> </div>
      </div>
      <!--ZOOMSTOP-->
    <div id="footer-wrap">
        <div id="footer-container">
            <div id="footer">
             <div id="contentfooter"><div class="leftfooter"><a href="../Sites/Index.html"> <img src="../afbeeldingen/Sitepictures/Homebutton.gif" width="40" height="40" border="none" /></a></div>
           <div class="rightfooter"><a href="../Sites/Index.html"> <img src="../afbeeldingen/Sitepictures/mail_button.gif" border="none" /></a></div>RELEASE CANDITATE VERSIE 3 BUILD 27041002 </div>
            </div>
        </div>
    </div>
    <script type="text/javascript">
    <!--
    var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1", {defaultTab: params.tab ? params.tab : 0});
    //-->
    </script>
    </body>
    </html>
    PAGE where i open the tabbed panels
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml"><!-- InstanceBegin template="/Templates/Naamloos-2.dwt" codeOutsideHTMLIsLocked="false" -->
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <!-- InstanceBeginEditable name="doctitle" -->
    <title>Third Party</title>
    <!-- InstanceEndEditable -->
    <!-- InstanceBeginEditable name="head" -->
    <!-- InstanceEndEditable -->
    <link href="../Stijlbladen/main4.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" type="text/css" href="../Stijlbladen/pro_dropdown_3.css"/>
    <script src="../SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
    <script type="text/javascript" src="../SpryAssets/SpryURLUtils.js"></script>
    <script type="text/javascript">var params = Spry.Utils.getLocationParamsAsObject(); </script>
    <link href="../SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
    <script src="../Scripts/stuHover.js" type="text/javascript"></script>
    <script type="text/javascript" src="../Scripts/percentageProgressBar.js"></script>
    <script type="text/javascript" src="../Scripts/paswoord.js"></script>
    <!--[if lt IE 7 ]>
    <link href="../Stijlbladen/ie6hacks.css" rel="stylesheet" type="text/css" />
    <![endif]-->
    </head>
    <body>
    <!--ZOOMSTOP-->
    <div id="header-wrap">
        <div id="header-container">
            <div id="header">
                    <div id="header-content">
                    <table width="890" border="0" cellspacing="1">
          <tr>
            <td width="100" height="50"><a href="Index.html"><img src="../afbeeldingen/Sitepictures/WN_OriginalImage.jpg" width="90" height="50"/></a></td>
            <td width="680">
         <span class="preload1"></span>
        <span class="preload2"></span>
            <ul id="nav">
                <li class="top"><a href="#nogo2" id="Algemeen" class="top_link"><span class="down">Algemeen</span></a>
                    <ul class="sub">
                    <li><b>Alg. Procedure</b></li>
                    <li><a href="#nogo3" class="fly">Car Policy</a>
                        <ul>
                            <li><a href="../Algemeen/CAR POLICY WN_dec2009.doc">Carpolicy NL</a></li>
                            <li><a href="../Algemeen/CAR POLICY WNdec2009FR.doc">Carpolicy FR</a></li>
                        </ul>
                    </li>
                    <li><a href="#nogo7" class="fly">Gsm Policy</a>
                        <ul>
                            <li><a href="#nogo8">Gsm Policy NL</a></li>
                            <li><a href="#nogo9">Gsm Policy FR</a></li>
                        </ul>
                    </li>
                    <li><b>Diversen</b></li>
                    <li><a href="../Algemeen/Skills.htm">Skills</a></li>
                    <li><a href="Verlof-Recup.html">Verlof</a></li>
                    <li><a href="Verlof-Recup.html">Recup</a></li>
            </ul>
                </li>
                <li class="top"><a href="#nogo2" id="Support" class="top_link"><span class="down">Support</span></a>
                    <ul class="sub">
                        <li><a href="../Algemeen/support/Artikellijst.xls">ArtikelLijst</a></li>
                        <li><a href="../Algemeen/support/Retail Algemeen.xls">Retail Algemeen</a></li>
                        <li><a href="../Algemeen/support/Barcodes v2-2.pdf">Barcode's ALL</a></li>
                        <li><a href="../Algemeen/support/CRM 2.2.pdf">CRM 2.2</a></li>
                        <li><a href="#nogo7" class="fly">Onkostennota</a>
                        <ul>
                            <li><a href="../Algemeen/dbourdon_1109.xls">Onkostennota NL</a></li>
                            <li><a href="../Algemeen/décompte de frais July 2009.xls">Onkostennota FR</a></li>
                        </ul>
                        </li>
                        <li><a href="#nogo7" class="fly">Online Tools</a>
                        <ul>
                            <li><a href="file://///Wincor-nixdorf/projects/BE/D34POOL/STOCK MAALBEEK/FIELD/PLOMPEN RETAIL LOC WB.xls">Stock E.Plompen</a></li>
                            <li><a href="login.html">Online map</a></li>
                            <li><a href="Fujitsu.html">Fujitsu Portal</a></li>
                        </ul>
                    </li>
                         <li><a href="#nogo7" class="fly">FAX Franchisé</a>
                        <ul>
                            <li><a href="../Algemeen/support/Fax franchisé NL4.doc">Franchisé NL</a></li>
                            <li><a href="../Algemeen/support/Fax franchisé FR4.doc">Franchisé FR</a></li>
                        </ul>
                        </li>
            </ul>
        </li>
        <li class="top"><a href="#nogo22" id="Contacts" class="top_link"><span class="down">Contacts</span></a>
            <ul class="sub">
                <li><a href="../Algemeen/contacts/technician.pdf">Retail Tech</a></li>
                <li><a href="../Algemeen/contacts/telretail.xls">Tel Ret/Helpdesk</a></li>
                <li><a href="../Algemeen/contacts/Telefoonlijst WN + WNS.xls">Tel WN/WNS</a></li>
            </ul>
        </li>
        <li class="top"><a href="#nogo27" id="Klanten" class="top_link"><span class="down">Klanten</span></a>
            <ul class="sub">
                <li><a href="Aldi.html">Aldi</a></li>
                <li><a href="Little Customers.html?tab=0#tabbedpanels1">Belgique Loisirs</a></li>
                <li><a href="Bonita.html">Bonita</a></li>
                <li><a href="Carrefour.html">Carrefour</a></li>
                <li><a href="C&amp;A.html">C &amp; A</a></li>
                <li><a href="Decathlon.html">Decathlon</a></li>
                <li><a href="Delhaize.html">Delhaize</a></li>
                <li><a href="Ici Paris XL.html">Ici Paris</a></li>
                <li><a href="Ikea.html">Ikea</a></li>
                <li><a href="Little Customers.html?tab=3#tabbedpanels1">Koodza</a></li>
                <li><a href="Kruidvat.html">Kruidvat</a></li>
                <li><a href="Lidl.html">Lidl</a></li>
                <li><a href="Living Tomorrow.html">Living Tomorrow</a></li>
                <li><a href="Mediamarkt.html">Mediamarkt</a></li>
                <li><a href="Scapino.html">Scapino</a></li>
                <li><a href="Little Customers.html?tab=2#tabbedpanels1">Takko</a></li>
                <li><a href="Little Customers.html?tab=1#tabbedpanels1">Texto</a></li>
            </ul>
        </li>
        <li class="top"><a href="#nogo63" id="ThirdParty" class="top_link"><span class="down">3th Party</span></a>
            <ul class="sub">
                <li><a href="third party.html?tab=5#tabbedpanels1">Fujitsu Siemens</a></li>
                <li><a href="third party.html?tab=4#tabbedpanels1">HP</a></li>
                <li><a href="third party.html?tab=6#tabbedpanels1">Datalogic</a></li>
                <li><a href="third party.html?tab=7#tabbedpanels1">Vensafe</a></li>
                <li><a href="third party.html?tab=1#tabbedpanels1">Scanners</a></li>
                <li><a href="third party.html?tab=0#tabbedpanels1">Scales</a></li>
            </ul>
        </li>
        <li class="top"><a href="Wincor-Nixdorf materiaal.html" id="WN-Material" class="top_link"><span>WN-Material</span></a></li>
        <li class="top"><a href="Technician tools.html" id="Techtools" class="top_link"><span>Techtools</span></a></li>
    </ul>
            </td>
          </tr>
        </table>
      <table width="1038" border="0" cellspacing="1">
      <tr>
        <td><form method="get" action="../indexer/search.html">
    <input type="text" name="zoom_query" size="30" />
    <input type="submit" value="Search" />
    </form></td>
        <td> </td>
        <td><div class="clock"><script type="text/javascript" language="javascript" src="../Scripts/datetime.js">
    </script></div>
    </td>
      </tr>
    </table>
             </div>
            </div>
        </div>
    </div>
    <!--ZOOMRESTART-->
    <div id="ie6-container-wrap" >
    <div id="container">   
            <!-- InstanceBeginEditable name="EditRegion1" -->
    <div id="boven"><img src="../afbeeldingen/Sitepictures/Datalogic_logo.jpg" alt="Datalogic" name="img2" width="100" height="100" id="img2" /> <img src="../afbeeldingen/Sitepictures/PSC-Logo4C.jpg" alt="PSC" name="img2" width="450" height="160" id="img2" /> <img src="../afbeeldingen/Sitepictures/NCRlogo.jpg" alt="NCR" name="img2" width="116" height="116" id="img2" /> <img src="../afbeeldingen/Sitepictures/symbol-logo.jpg" alt="Symbol" name="img2" width="200" height="150" id="img2" /></div>
        <div id="TabbedPanels1" class="TabbedPanels">
          <ul class="TabbedPanelsTabGroup">
            <li class="TabbedPanelsTab" tabindex="0">kassascanners</li>
            <li class="TabbedPanelsTab" tabindex="0">Handscanners</li>
            <li class="TabbedPanelsTab" tabindex="0">Scales</li>
            <li class="TabbedPanelsTab" tabindex="0">Kassaprinters</li>
            <li class="TabbedPanelsTab" tabindex="0">HP</li>
            <li class="TabbedPanelsTab" tabindex="0">Fujitsu-Siemens</li>
            <li class="TabbedPanelsTab" tabindex="0">Datalogic</li>
            <li class="TabbedPanelsTab" tabindex="0">Vensafe</li>
          </ul>
          <div class="TabbedPanelsContentGroup">
            <div class="TabbedPanelsContent">
               <div class="links"></div>
              <div class="rechts"></div>
             <div class="midden"></div>
            </div>
            <div class="TabbedPanelsContent">
             <div class="links"></div>
               <div class="rechts"></div>
              <div class="midden"></div>
            </div>
           <div class="TabbedPanelsContent">
              <div class="links"></div>
              <div class="rechts"></div>
              <div class="midden"></div>
            </div>
            <div class="TabbedPanelsContent">
              <div class="links"></div>
              <div class="rechts"></div>
              <div class="midden"></div>
            </div>
            <div class="TabbedPanelsContent">
              <div class="links"></div>
              <div class="rechts"></div>
              <div class="midden"></div>
            </div>
            <div class="TabbedPanelsContent">
             <div class="links"></div>
             <div class="rechts"></div>
            <div class="midden"></div>
            </div>
            <div class="TabbedPanelsContent">
             <div class="links"></div>
             <div class="rechts"></div>
            <div class="midden"></div>
            </div>
            <div class="TabbedPanelsContent">
             <div class="links"></div>
             <div class="rechts"></div>
            <div class="midden"></div>
            </div>
          </div>
           <div class="clearfix:after"> </div>
        </div>
    <!-- InstanceEndEditable -->
        </div>
        <div class="clearfix:after"> </div>
      </div>
      <!--ZOOMSTOP-->
    <div id="footer-wrap">
        <div id="footer-container">
            <div id="footer">
             <div id="contentfooter"><div class="leftfooter"><a href="Index.html"> <img src="../afbeeldingen/Sitepictures/Homebutton.gif" width="40" height="40" border="none" /></a></div>
           <div class="rightfooter"><a href="Index.html"> <img src="../afbeeldingen/Sitepictures/mail_button.gif" border="none" /></a></div>RELEASE CANDITATE VERSIE 3 BUILD 27041002 </div>
            </div>
        </div>
    </div>
    <script type="text/javascript">
    <!--
    var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1", {defaultTab: params.tab ? params.tab : 0});
    //-->
    </script>
    </body>
    <!-- InstanceEnd --></html>
    TABBED PANELS CSS
    @charset "UTF-8";
    /* SpryTabbedPanels.css - version 0.4 - Spry Pre-Release 1.6.1 */
    /* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
    /* Horizontal Tabbed Panels
    * The default style for a TabbedPanels widget places all tab buttons
    * (left aligned) above the content panel.
    /* This is the selector for the main TabbedPanels container. For our
    * default style, this container does not contribute anything visually,
    * but it is floated left to make sure that any floating or clearing done
    * with any of its child elements are contained completely within the
    * TabbedPanels container, to minimize any impact or undesireable
    * interaction with other floated elements on the page that may be used
    * for layout.
    * If you want to constrain the width of the TabbedPanels widget, set a
    * width on the TabbedPanels container. By default, the TabbedPanels widget
    * expands horizontally to fill up available space.
    * The name of the class ("TabbedPanels") used in this selector is not
    * necessary to make the widget function. You can use any class name you
    * want to style the TabbedPanels container.
    .TabbedPanels {
        width: 1040px; /* IE Hack to force proper layout when preceded by a paragraph. (hasLayout Bug)*/
        position: static;
        float: left;
    /* This is the selector for the TabGroup. The TabGroup container houses
    * all of the tab buttons for each tabbed panel in the widget. This container
    * does not contribute anything visually to the look of the widget for our
    * default style.
    * The name of the class ("TabbedPanelsTabGroup") used in this selector is not
    * necessary to make the widget function. You can use any class name you
    * want to style the TabGroup container.
    .TabbedPanelsTabGroup {
        margin: 0px;
        padding: 0px;
    /* This is the selector for the TabbedPanelsTab. This container houses
    * the title for the panel. This is also the tab "button" that the user clicks
    * on to activate the corresponding content panel so that it appears on top
    * of the other tabbed panels contained in the widget.
    * For our default style, each tab is positioned relatively 1 pixel down from
    * where it wold normally render. This allows each tab to overlap the content
    * panel that renders below it. Each tab is rendered with a 1 pixel bottom
    * border that has a color that matches the top border of the current content
    * panel. This gives the appearance that the tab is being drawn behind the
    * content panel.
    * The name of the class ("TabbedPanelsTab") used in this selector is not
    * necessary to make the widget function. You can use any class name you want
    * to style this tab container.
    .TabbedPanelsTab {
        position: static;
        top: 1px;
        float: left;
        font: bold 0.7em sans-serif;
        background-color: #FF0033;
        list-style: none;
        border-left: solid 1px #CCC;
        border-bottom: solid 1px #999;
        border-top: solid 1px #999;
        border-right: solid 1px #999;
        -moz-user-select: none;
        -khtml-user-select: none;
        cursor: pointer;
        margin-top: 0px;
        margin-right: 1px;
        margin-bottom: 0px;
        margin-left: 0px;
        padding-top: 4px;
        padding-right: 5px;
        padding-bottom: 4px;
        padding-left: 5px;
    /* This selector is an example of how to change the appearnce of a tab button
    * container as the mouse enters it. The class "TabbedPanelsTabHover" is
    * programatically added and removed from the tab element as the mouse enters
    * and exits the container.
    .TabbedPanelsTabHover {
        background-color: #75A7D0;
    /* This selector is an example of how to change the appearance of a tab button
    * container after the user has clicked on it to activate a content panel.
    * The class "TabbedPanelsTabSelected" is programatically added and removed
    * from the tab element as the user clicks on the tab button containers in
    * the widget.
    * As mentioned above, for our default style, tab buttons are positioned
    * 1 pixel down from where it would normally render. When the tab button is
    * selected, we change its bottom border to match the background color of the
    * content panel so that it looks like the tab is part of the content panel.
    .TabbedPanelsTabSelected {
        border-bottom: 2px solid #EEE;
        color: #FFF;
        background-color: #000;
    /* This selector is an example of how to make a link inside of a tab button
    * look like normal text. Users may want to use links inside of a tab button
    * so that when it gets focus, the text *inside* the tab button gets a focus
    * ring around it, instead of the focus ring around the entire tab.
    .TabbedPanelsTab a {
        color: black;
        text-decoration: none;
    /* This is the selector for the ContentGroup. The ContentGroup container houses
    * all of the content panels for each tabbed panel in the widget. For our
    * default style, this container provides the background color and borders that
    * surround the content.
    * The name of the class ("TabbedPanelsContentGroup") used in this selector is
    * not necessary to make the widget function. You can use any class name you
    * want to style the ContentGroup container.
    .TabbedPanelsContentGroup {
        clear: both;
        border-top-width: 1px;
        border-right-width: 1px;
        border-bottom-width: 1px;
        border-left-width: 1px;
        border-top-style: none;
        border-right-style: none;
        border-bottom-style: none;
        border-left-style: none;
        float: left;
    /* This is the selector for the Content panel. The Content panel holds the
    * content for a single tabbed panel. For our default style, this container
    * provides some padding, so that the content is not pushed up against the
    * widget borders.
    * The name of the class ("TabbedPanelsContent") used in this selector is
    * not necessary to make the widget function. You can use any class name you
    * want to style the Content container.
    .TabbedPanelsContent {
        padding: 4px;
        height: 100%;
        width: 1032px;
        float: left;
    /* This selector is an example of how to change the appearnce of the currently
    * active container panel. The class "TabbedPanelsContentVisible" is
    * programatically added and removed from the content element as the panel
    * is activated/deactivated.
    .TabbedPanelsContentVisible {
        background-color: #FFF;
    /* Vertical Tabbed Panels
    * The following rules override some of the default rules above so that the
    * TabbedPanels widget renders with its tab buttons along the left side of
    * the currently active content panel.
    * With the rules defined below, the only change that will have to be made
    * to switch a horizontal tabbed panels widget to a vertical tabbed panels
    * widget, is to use the "VTabbedPanels" class on the top-level widget
    * container element, instead of "TabbedPanels".
    /* This selector floats the TabGroup so that the tab buttons it contains
    * render to the left of the active content panel. A border is drawn around
    * the group container to make it look like a list container.
    .VTabbedPanels .TabbedPanelsTabGroup {
        float: left;
        width: 10em;
        height: 20em;
        background-color: #CCC;
        position: relative;
        border-top: solid 1px #999;
        border-right: solid 1px #999;
        border-left: solid 1px #CCC;
        border-bottom: solid 1px #CCC;
    /* This selector disables the float property that is placed on each tab button
    * by the default TabbedPanelsTab selector rule above. It also draws a bottom
    * border for the tab. The tab button will get its left and right border from
    * the TabGroup, and its top border from the TabGroup or tab button above it.
    .VTabbedPanels .TabbedPanelsTab {
        float: none;
        margin: 0px;
        border-top: none;
        border-left: none;
        border-right: none;
    /* This selector disables the float property that is placed on each tab button
    * by the default TabbedPanelsTab selector rule above. It also draws a bottom
    * border for the tab. The tab button will get its left and right border from
    * the TabGroup, and its top border from the TabGroup or tab button above it.
    .VTabbedPanels .TabbedPanelsTabSelected {
        background-color: #EEE;
        border-bottom: solid 1px #999;
    /* This selector floats the content panels for the widget so that they
    * render to the right of the tabbed buttons.
    .VTabbedPanels .TabbedPanelsContentGroup {
        clear: none;
        float: left;
        padding: 0px;
        width: 30em;
        height: 20em;

    added also the css for the menubar
    pro_dropdown_3.css
    .preload1 {
        background-image: url(../afbeeldingen/Sitepictures/three_0a.gif);
    .preload2 {
        background-image: url(../afbeeldingen/Sitepictures/three_1a.gif);
    #nav {
        padding:0;
        margin:0;
        list-style:none;
        height:38px;
        position:relative;
        z-index:500;
        font-family:arial, verdana, sans-serif;
        background-image: url(../afbeeldingen/Sitepictures/three_0.gif);
        background-repeat: repeat-x;
    #nav li.top {
        display:block;
        float:left;
        width: auto;
    #nav li a.top_link {
        display:block;
        float:left;
        height:35px;
        line-height:33px;
        color:#ccc;
        text-decoration:none;
        font-size:11px;
        font-weight:bold;
        cursor:pointer;
        background-image: url(../afbeeldingen/Sitepictures/three_0.gif);
        width: 85px;
        padding-top: 0;
        padding-right: 0;
        padding-bottom: 0;
        padding-left: 2px;
    #nav li a.top_link span {
        float:left;
        display:block;
        height:35px;
        background-image: url(../afbeeldingen/Sitepictures/three_0.gif);
        background-repeat: no-repeat;
        background-position: right top;
        width: 70px;
        padding-top: 0;
        padding-right: 10px;
        padding-bottom: 0;
        padding-left: 10px;
    #nav li a.top_link span.down {
        float:left;
        display:block;
        padding:0 10px 0 12px;
        height:35px;
        background-image: url(../afbeeldingen/Sitepictures/three_0a.gif);
        background-repeat: no-repeat;
        background-position: right top;
    #nav li:hover a.top_link {
        color:#fff;
        background-image: url(../afbeeldingen/Sitepictures/three_1.gif);
        background-repeat: no-repeat;
    #nav li:hover a.top_link span {
        background-image: url(../afbeeldingen/Sitepictures/three_1.gif);
        background-repeat: no-repeat;
        background-position: right top;
    #nav li:hover a.top_link span.down {
        padding-bottom:3px;
        background-image: url(../afbeeldingen/Sitepictures/three_1a.gif);
        background-repeat: no-repeat;
        background-position: right top;
    /* Default list styling */
    #nav li:hover {position:relative; z-index:200;}
    #nav li:hover ul.sub
    {left:1px; top:38px; background: #50b5d0; padding:3px; border:1px solid #0b4d97; white-space:nowrap; width:90px; height:auto; z-index:300;}
    #nav li:hover ul.sub li
    {display:block; height:20px; position:relative; float:left; width:90px; font-weight:normal;}
    #nav li:hover ul.sub li a
    {display:block; font-size:11px; height:18px; width:88px; line-height:18px; text-indent:5px; color:#000; text-decoration:none;border:1px solid #50b5d0;}
    #nav li ul.sub li a.fly
        background-color: #50b5d0;
        background-image: url(../afbeeldingen/Sitepictures/arrow.gif);
        background-repeat: no-repeat;
        background-position: 80px 6px;
    #nav li:hover ul.sub li a:hover
    {background:#3f96a9; color:#fff; border-color:#fff;}
    #nav li:hover ul.sub li a.fly:hover
        color:#fff;
        background-color: #3f96a9;
        background-image: url(../afbeeldingen/Sitepictures/arrow_over.gif);
        background-repeat: no-repeat;
        background-position: 80px 6px;
    #nav li b {display:block; font-size:11px; height:18px; width:88px; line-height:18px; margin-bottom:3px; text-indent:6px; color:#ff6; border-bottom:1px solid #ff6; cursor:default;}
    #nav li:hover li:hover ul,
    #nav li:hover li:hover li:hover ul,
    #nav li:hover li:hover li:hover li:hover ul,
    #nav li:hover li:hover li:hover li:hover li:hover ul
    {left:90px; top:-4px; background: #50b5d0; padding:3px; border:1px solid #0b4d97; white-space:nowrap; width:90px; z-index:400; height:auto;}
    #nav ul,
    #nav li:hover ul ul,
    #nav li:hover li:hover ul ul,
    #nav li:hover li:hover li:hover ul ul,
    #nav li:hover li:hover li:hover li:hover ul ul
    {position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}
    #nav li:hover li:hover a.fly,
    #nav li:hover li:hover li:hover a.fly,
    #nav li:hover li:hover li:hover li:hover a.fly,
    #nav li:hover li:hover li:hover li:hover li:hover a.fly
        color:#fff;
        border-color:#fff;
        background-color: #3f96a9;
        background-image: url(../afbeeldingen/Sitepictures/arrow_over.gif);
        background-repeat: no-repeat;
        background-position: 80px 6px;
    #nav li:hover li:hover li a.fly,
    #nav li:hover li:hover li:hover li a.fly,
    #nav li:hover li:hover li:hover li:hover li a.fly
        color:#000;
        border-color:#50b5d0;
        background-color: #50b5d0;
        background-image: url(../afbeeldingen/Sitepictures/arrow.gif);
        background-repeat: no-repeat;
        background-position: 80px 6px;

  • Adobe InDesign CC 2014 Custom Panel Built With Extension Builder - Problem: Can't tab from one entry field to the next; Hitting tab instead hides all palettes; Is there a fix? This didn't happen in Adobe Indesign CC

    Adobe InDesign CC 2014 Custom Panel Built With Extension Builder - Problem: Can't tab from one entry field to the next; Hitting tab instead hides all palettes; Is there a fix? This didn't happen in Adobe Indesign CC

    This is planned to be fixed in the next release.

  • Problem with Required fields in Panel Tabbed

    Hi ,
    I am using Jdeveloper 11.1.1.2 and i created a jspx page in which i am using <af:panel Tabbed> which has 2 <af:showDetailItem> items.
    Here the problem is in each show detail item i have selectOneChoice set as required fileds. when i am runnin the page and click the second tab it is asking to select a value for SOC.
    Can anyone help me in how to make required fileds show only for that <showdetailitem> item but not for both the showdetailitems.
    Thanks,
    Harika.

    Set the immediate property for the tab to be true.
    Similar forum post:
    Issue with Panel Tabbed and required property
    Thanks,
    Navaneeth

  • Spry Tabbed Panels - replace text tab with an image, how to?

    Hi all, I'm stumped. I've uploaded 2 files to:
    http://docs.google.com/leaf?id=0B4zgjxAaUD97MmUzZTk3NjMtMDNkYi00NDJjLWExNzctOWNjMzM0MDlmMj g0&hl=en&authkey=CMWGoeEP
    http://docs.google.com/leaf?id=0B4zgjxAaUD97YTQ1MDliNzEtZGVhZS00MmYzLTllZWMtMzJiODQwMjRlMT Bl&hl=en&authkey=CILrxq0G
    I'm working in Dreamweaver CS3, 4 tab "Spry Tabbed Panel" with 3 columns (one column is a form and submit btn). The 1st photo is a mockup of what I'm trying to accomplish. In the 2nd photo, Nokia designed a page for its Nokia Developer Summit 2010 (been pulled down since). This is the desired effect. I'm trying to replace the typical text tabs in the tabbed panel with images, or, at the very least, change the color between states ON and OFF (images the same except for bg color - green verses gray), which is probably the better way to go, given page load time.
    I need the CSS and HTML code. I'd settle for just the image problem, but if someone can give me guidance on the content boxes too, that would be AWESOME!
    REALLY hoping anyone can help (Ben, I'm an Aussie too) - been on this for a month now.
    Very grateful Adobe staffs such a great resource tool as this site with a lot of really good, courteous brainiacs.
    Thanks,
    Louis cat

    G'day Ben,
    Upgraded to Dreamweaver CS5, added Tabbed Panels 2 widget to page.
    Here's a mockup of what I'm trying to do: http://docs.google.com/leaf?id=0B4zgjxAaUD97MmUzZTk3NjMtMDNkYi00NDJjLWExNzctOWNjMzM0MDlmMj g0&hl=en&authkey=CMWGoeEP
    Questions:
    1. Want to change Spry TP tabs to images (see link, above), then make them vertical tabs, with morph effect - How?
    2. How do I change the default TabbedPanels2 instance name? (not easy to rename)
    3. The first section of the code was planted in my index page - shouldn't this be pasted into a CSS file, or just leave it alone?
    ================================================
    FIRST SECTION OF THE CODE: -------------------------------------------------------------------------------
    <style type="text/css">
    /* BeginOAWidget_Instance_2138522: #TabbedPanels2 */
    /* TabbedPanelsTabGroup */
    #TabbedPanels2 .TabbedPanelsTabGroup {
    top: 1px;
    left: 0px;
    font-family: inherit;
    font-weight: inherit;
    font-size: inherit;
    color: inherit;
    background-color: transparent;
    border-left: solid 0px inherit;
    border-bottom: solid 0px inherit;
    border-top: solid 0px inherit;
    border-right: solid 0px inherit;
    padding: 0px 0px 0px 0px;
    /* TabbedPanelsTab */
    #TabbedPanels2.TabbedPanels .TabbedPanelsTab,
    #TabbedPanels2.VTabbedPanels .TabbedPanelsTab {
    font-family: inherit;
    font-weight: inherit;
    font-size: inherit;
    color: inherit;
    background-color: #DDD;
    border-left: solid 1px #CCC;
    border-bottom: solid 1px #999;
    border-top: solid 1px #999;
    border-right: solid 1px #999;
    padding: 4px 10px 4px 10px;
    #TabbedPanels2.TabbedPanels .TabbedPanelsTab a,
    #TabbedPanels2.VTabbedPanels .TabbedPanelsTab a {
    font-family: inherit;
    font-weight: inherit;
    font-size: inherit;
    color: inherit;
    /* TabbedPanelsTabHover */
    #TabbedPanels2.TabbedPanels .TabbedPanelsTabHover,
    #TabbedPanels2.VTabbedPanels .TabbedPanelsTabHover {
    font-family: inherit;
    font-weight: inherit;
    font-size: inherit;
    color: inherit;
    background-color: #EEE;
    border-left: solid 1px #CCC;
    border-bottom: solid 1px #999;
    border-top: solid 1px #999;
    border-right: solid 1px #999;
    padding: 4px 10px 4px 10px;
    #TabbedPanels2.TabbedPanels .TabbedPanelsTabHover a,
    #TabbedPanels2.VTabbedPanels .TabbedPanelsTabHover a {
    font-family: inherit;
    font-weight: inherit;
    font-size: inherit;
    color: inherit;
    /* TabbedPanelsTabSelected */
    #TabbedPanels2.TabbedPanels .TabbedPanelsTabSelected,
    #TabbedPanels2.VTabbedPanels .TabbedPanelsTabSelected {
    font-family: inherit;
    font-weight: inherit;
    font-size: inherit;
    color: inherit;
    background-color: #EEE;
    border-left: solid 1px #CCC;
    border-bottom: solid 1px #EEE;
    border-top: solid 1px #999;
    border-right: solid 1px #999;
    padding: 4px 10px 4px 10px;
    #TabbedPanels2.TabbedPanels .TabbedPanelsTabSelected a,
    #TabbedPanels2.VTabbedPanels .TabbedPanelsTabSelected a {
    font-family: inherit;
    font-weight: inherit;
    font-size: inherit;
    color: inherit;
    /* TabbedPanelsTabFocused */
    #TabbedPanels2.TabbedPanels .TabbedPanelsTabFocused,
    #TabbedPanels2.VTabbedPanels .TabbedPanelsTabFocused {
    font-family: inherit;
    font-weight: inherit;
    font-size: inherit;
    color: inherit;
    background-color: #EEE;
    border-left: solid 1px #CCC;
    border-bottom: solid 1px #EEE;
    border-top: solid 1px #999;
    border-right: solid 1px #999;
    padding: 4px 10px 4px 10px;
    #TabbedPanels2.TabbedPanels .TabbedPanelsTabFocused a,
    #TabbedPanels2.VTabbedPanels .TabbedPanelsTabFocused a {
    font-family: inherit;
    font-weight: inherit;
    font-size: inherit;
    color: inherit;
    /* TabbedPanelsContentGroup */
    #TabbedPanels2 .TabbedPanelsContentGroup {
    font-family: inherit;
    font-weight: inherit;
    font-size: inherit;
    color: inherit;
    background-color: #EEE;
    border-left: solid 1px #CCC;
    border-bottom: solid 1px #CCC;
    border-top: solid 1px #999;
    border-right: solid 1px #999;
    padding: 0px 0px 0px 0px;
    /* TabbedPanelsContentVisible */
    #TabbedPanels2 .TabbedPanelsContentVisible {
    font-family: inherit;
    font-weight: inherit;
    font-size: inherit;
    color: inherit;
    background-color: transparent;
    border-left: solid 0px #CCC;
    border-bottom: solid 0px #CCC;
    border-top: solid 0px #999;
    border-right: solid 0px #999;
    padding: 4px 12px 4px 12px;
    #TabbedPanels2.BTabbedPanels .TabbedPanelsTab {
    border-bottom: solid 1px #999;
    border-top: solid 1px #999;
    #TabbedPanels2.BTabbedPanels .TabbedPanelsTabSelected {
    border-top: solid 1px #999;
    #TabbedPanels2.VTabbedPanels .TabbedPanelsTabGroup {
    width: 10em;
    height: 20em;
    top: 1px;
    left: 0px;
    #TabbedPanels2.VTabbedPanels .TabbedPanelsTabSelected {
    background-color: #EEE;
    border-bottom: solid 1px #EEE;
    /* EndOAWidget_Instance_2138522 */
    </style>
    ========================================================
    SECOND SECTION OF THE CODE: ----------------------------------------------------------------------------------------
      <div id="TabbedPanels2">
        <h2>Tab 1</h2>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce sapien lacus, porttitor vitae pretium eget, sodales sed libero. Maecenas non urna lacus, ac sollicitudin justo. Ut erat mi, hendrerit ac accumsan ac, congue eu dui. Pellentesque consectetur condimentum elit, et eleifend urna porta id.  </p>
        <h2>Tab 2</h2>
        <p>Nulla facilisi. Vestibulum ipsum elit, tincidunt sed tristique sit amet, faucibus in orci. Nunc sit amet elit lorem. Sed eget arcu ipsum, pharetra ullamcorper lectus. Sed ac diam ac tortor mattis mollis. Etiam mattis felis vel augue tempus in rhoncus ligula elementum. Vestibulum ut iaculis risus. Aliquam erat sem, feugiat vel laoreet in, lobortis non mauris. Vestibulum neque nibh, vehicula eleifend tincidunt sed, bibendum id dolor. </p>
        <h2>Tab 3</h2>
        <p>Suspendisse potenti. Proin ut erat sit amet turpis egestas tempor. Integer arcu dolor, aliquam ut egestas nec, pharetra ut mauris. Duis urna mi, aliquam id vulputate et, consequat in dolor. Duis congue sem feugiat nulla malesuada scelerisque. Aenean vitae augue nec diam euismod imperdiet. </p>
      </div>
      <script type="text/javascript">
    // BeginOAWidget_Instance_2138522: #TabbedPanels2
      var TabbedPanels2 = new Spry.Widget.TabbedPanels2("TabbedPanels2", {
       injectionType: "replace",
       widgetID: "TabbedPanels2",
       autoPlay: true,
       defaultTab: 0,
       enableKeyboardNavigation: true,
       hideHeader: true,
       tabsPosition: "top",
       event:"click",
       stopOnUserAction: true,
       displayInterval: 5000,
       minDuration: 300,
       maxDuration: 500,
       stoppedMinDuration: 100,
       stoppedMaxDuration: 200,
       plugIns:[]
    // EndOAWidget_Instance_2138522
      </script>
    ===================================================
    Any help would be much appreciated, Ben. Cheers from another Aussie. Louis Cat!

  • Selectable Dialog Panel Tab Order Reversed when Plug-In compiled with XCode 3

    Hi,
    I'm not sure if anyone has seen this before, but I am experiencing
    a problem with the order of the panel tabs in a selectable dialog when compiling
    a CS3 plug-in using the following configuration.
    OSX 10.5.4
    XCode 3.
    ID SDK 5.0.3
    The problem is evident in the sample SDK plug-in "BasicSelectableDialog"
    Other than the obvious ( i.e. use XCode 2.4.1 ) is there a simple configuration fix for this??
    Regards,
    Mike.

    Update::
    Seems to be a problem with the ResourceEnabler or the call to CDialogCreator::GetOrderedPanelIDs() in the GetOrderedPanelIDs call in the dialog creator.
    The list returned is always empty when compiled in XCode 3, but filled in when compiled using XCode 241.
    Regards,
    Mike.

  • Tabbed panels conflicts with scroll!

    I have a strange problem! in DW CS3. Have a html-file id layer with css. Put on Tapped Panels - works OK.
    My text is too long so I set on the scroll function.
    Just after that the little blue outline box for tabbered panels disappered and I can no longer edit the text in the
    content.... HELP please

    I found this code on expert exchange, so basicaly all you
    would do is set up your tabs with an onclick and have it run this
    function that will change out code on click
    http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_23455568.html
    <script>
    var yt1Object = '<object.....</object>'
    var yt2Object = '<object.....</object>'
    var yt3Object = '<object.....</object>'
    var yt1Image = '<a href="#" onClick="return
    swap('yt1','yt2','y3')"><img src="yt1.jpg" border="0"
    /></a>'
    var yt2Image = '<a href="#" onClick="return
    swap('yt2','yt1','y3')"><img src="yt2.jpg" border="0"
    /></a>'
    var yt3Image = '<a href="#" onClick="return
    swap('yt2','yt1','y2')"><img src="yt3.jpg" border="0"
    /></a>'
    function swap(o1,o2, o3) {
    document.getElementById(o2).innerHTML=eval(o2+'Image');
    document.getElementById(o3).innerHTML=eval(o3+'Image');
    document.getElementById(o1).innerHTML=eval(o1+'Object');
    return false;
    </script>
    <div
    id="yt1"><object....></object></div>
    <div id="yt2"><a href="#" onClick="return
    swap('yt2','yt1','y3')"><img src="yt2.jpg" border="0"
    /></a></div>
    <div id="yt3"><a href="#" onClick="return
    swap('yt3','yt1','y2')"><img src="yt3.jpg" border="0"
    /></a></div>

  • RE: How to set createInsert operation with panel tab

    Hi all,
    I am using Jdeveloper 11.1.2.3.0
    Here i have one form and it contains two panel tabbed subDetailedItems called List and New.
    I have table in List Tab and form in New Tab.
    Now my requirement is if i select New tab then it has to display empty fields to enter new record.
    Help me to resolve the issue.
    Thanks,
    Syam

    Nitesh,
    I understood the usecase. But my question was, what happens if the user clicks on the New tab (a new record gets created due to createInsert - but not committed), then go back to another tab and then click on New tab again (another new record gets created due to next createInsert). Now, if the user commits, after entering values, he would have 2 rows added to the table (one with blank values and next one with data). You should have to handle that as well.
    -Arun

Maybe you are looking for