Trouble inserting repeating region as right sidebar in template

Hi,
my website has a main section and a left sidebar. I want to add a right sidebar of the same size and colour as the left one.
I've tried interesting an editable repeating region like the adobe help file Dreamweaver / Creating editable regions in templates says
http://help.adobe.com/en_US/dreamweaver/cs/using/WScbb6b82af5544594822510a94ae8d65-7ab7a.h tml#WScbb6b82af5544594822510a94ae8d65-7ab6a
I can't click the mouse on the top right hand side of the main body, i.e. can't place the cursor there to be able to insert the repeating region where I want to insert it.
when i do insert the editable region, it places it at the bottom left of my template and I can't move it around to the top right side where I want it.
website is
http://www.addcoach4u.com
using dreamweaver CS3 on a Mac
Any ideas?

Thanks Nancy,
cool site. I like the other designs on his site here too
http://matthewjamestaylor.com/blog/-website-layouts
any url for how to import my old design into that new template? ie how to put the top two nav bars that would extend across the page on top of the 3 column layout & add a footer at the bottom of the 3 column layout that goes on the bottom of the 3 column layout?

Similar Messages

Help-help-help! IE7 footer & repeatable region container height

Hi everyone, I am new here so sorry if I am repeating a topic discussed already.
I have 2 problems from my template:
1. My website looks fine in Safari, FF but IE7 footer floats upto a div halfway up the page then the content is behind it and continues to the bottom of the screen, am I missing a vital trick here (is it best to have a main container for all content and a footer container outside this main content?)
2. If I put a div container around the 2 repeatable regions which are called ("main_content" and "sidebar") when I click the + on the editable region in the html page the outer container doesn't auto fit the height, how can I make outer container auto fit to how many repeatable regions I have clicked.
Template source code is below and test web page with 5 repeatable regions is http://aegmotorhomes.co.uk/test.html
I will take this time now to say thank you and to apologise for this dribble I may have wrote.
<!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" />
<title>Untitled Document</title>
<style type="text/css">
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
#container {
background-image: url(../MOTORHOME%20IMAGES/Top%20Nav/topbanner.jpg);
background-repeat: repeat-x;
#TOPSPACE {
height: 5px;
width: 910px;
margin-right: auto;
margin-left: auto;
#search_container {
height: 35px;
width: 970px;
#search {
float: right;
width: 250px;
height: 25px;
#top_links {
height: 20px;
width: 970px;
margin-right: auto;
margin-left: auto;
font-family: Arial, Helvetica, sans-serif;
font-size: small;
color: #FFF;
font-weight: lighter;
font-style: normal;
line-height: normal;
#content {
background-image: url(../MOTORHOME%20IMAGES/Top%20Nav/TOPIMAGE.jpg);
width: 970px;
margin-right: auto;
margin-left: auto;
height: 266px;
background-repeat: no-repeat;
#navspacer {
height: 22px;
width: 970px;
margin-right: auto;
margin-left: auto;
#navbar {
height: 28px;
width: 970px;
margin-right: auto;
margin-left: auto;
#footer {
background-image: url(../MOTORHOME%20IMAGES/Footer/Screen%20shot%202011-07-15%20at%2016.16.51.png);
height: 350px;
clear: both;
position: relative;
#nav_bootomspacer {
height: 5px;
width: 970px;
margin-right: auto;
margin-left: auto;
#tab_spacer {
float: left;
height: 28px;
width: 15px;
#spacer2 {
height: 115px;
width: 970px;
margin-right: auto;
margin-left: auto;
#main_content {
float: left;
height: auto;
width: 715px;
font-family: Arial, Helvetica, sans-serif;
font-size: medium;
color: #397A7A;
background-color: #FFF;
padding-top: 5px;
padding-right: 0px;
padding-bottom: 5px;
padding-left: 10px;
body,td,th {
font-family: Arial, Helvetica, sans-serif;
font-size: medium;
color: #387675;
text-align: left;
a {
font-family: Arial, Helvetica, sans-serif;
font-size: small;
a:link {
color: #FFF;
text-decoration: none;
a:visited {
color: #FFF;
text-decoration: none;
a:hover {
color: #55B0B1;
text-decoration: none;
a:active {
color: #FFF;
text-decoration: none;
font-size: small;
#copyright_spacer {
height: 10px;
width: 970px;
margin-right: auto;
margin-left: auto;
#Copyright {
font-family: Arial, Helvetica, sans-serif;
font-size: small;
color: #FFF;
height: 20px;
width: 970px;
margin-right: auto;
margin-left: auto;
#copy {
height: 20px;
width: 400px;
float: left;
#legal {
width: 30px;
float: right;
height: 20px;
#legal_space {
float: right;
width: 180px;
height: 20px;
#footer_details {
height: 100px;
width: 960px;
margin-right: auto;
margin-left: auto;
padding-left: 10px;
#footer_links {
height: 145px;
width: 970px;
margin-right: auto;
margin-left: auto;
border-bottom-width: thin;
border-bottom-style: dotted;
border-bottom-color: #333;
#footer_links table colour {
color: #FFF;
font-family: Arial, Helvetica, sans-serif;
font-size: small;
#bottom_link_spacer {
height: 10px;
width: 970px;
margin-right: auto;
margin-left: auto;
#copy_left_spacer {
float: left;
height: 20px;
width: 20px;
#bottom_contact {
font-family: Arial, Helvetica, sans-serif;
font-size: small;
color: #FFF;
float: left;
height: 110px;
width: 200px;
#logo_bottom {
float: left;
height: 110px;
width: 175px;
#footer_link_space {
height: 30px;
width: 970px;
margin-right: auto;
margin-left: auto;
#floatspace {
clear: both;
height: 20px;
#clowe {
float: right;
height: 60px;
width: 240px;
#footlinks {
float: left;
height: 140px;
width: 600px;
#socialmedia {
width: 210px;
float: right;
#socialspacer {
float: right;
height: 80px;
width: 300px;
#footlinks table medium {
font-size: medium;
#footlinks table tr td a {
font-size: small;
color: #CCC;
#you_are_here {
font-family: Arial, Helvetica, sans-serif;
font-size: small;
color: #666;
width: 930px;
margin-right: auto;
margin-left: auto;
#youspacer {
height: 15px;
width: 970px;
margin-right: auto;
margin-left: auto;
.you_are_herecolour {
color: #409EA0;
font-weight: bold;
.fillin {
font-weight: bold;
color: #387675;
#sidebar {
float: right;
height: auto;
width: 199px;
padding-right: 20px;
padding-left: 22px;
background-image: url(../MOTORHOME%20IMAGES/Sidebar/sibar%20temp.jpg);
background-repeat: no-repeat;
#adverts {
margin-bottom: 20px;
</style>
<script type="text/javascript">
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
</script>
<link href="../MOTORHOME IMAGES/CSS/Footer Links.css" rel="stylesheet" type="text/css" />
</head>
<body onload="MM_preloadImages('../MOTORHOME IMAGES/Tabs/2swift.jpg','../MOTORHOME IMAGES/Tabs/2escape.jpg','../MOTORHOME IMAGES/Tabs/2autocruise.jpg','../MOTORHOME IMAGES/Tabs/2used.jpg','../MOTORHOME IMAGES/Tabs/2service.jpg')">
<div id="container">
<div id="headwrap">
<div id="content">
    <div id="TOPSPACE"></div>
    <div id="search_container">
      <div id="search">
        <script type="text/javascript">
// Google Internal Site Search script- By JavaScriptKit.com (http://www.javascriptkit.com)
// For this and over 400+ free scripts, visit JavaScript Kit- http://www.javascriptkit.com/
// This notice must stay intact for use
//Enter domain of site to search.
var domainroot="aegmotorhomes.co.uk"
function Gsitesearch(curobj){
curobj.q.value="site:"+domainroot+" "+curobj.qfront.value
        </script>
        <form action="http://www.google.com/search" method="get" onSubmit="Gsitesearch(this)">
          <input name="q" type="hidden" />
          <input name="qfront" type="text" style="width: 150px" />
          <input type="submit" value="Search" />
        </form>
      </div>
    </div>
    <div id="top_links">
      <div align="right"><a href="http://www.aegmotorhomes.co.uk/">Home</a> | <a href="http://aegmotorhomes.co.uk/news.html">News</a> | <a href="http://aegmotorhomes.co.uk/offers.html">Offers</a> |<a href="http://aegmotorhomes.co.uk/brochures.html"> Brochures</a> | <a href="http://aegmotorhomes.co.uk/insurance.html">Insurance Repairs </a>| <a href="http://aegmotorhomes.co.uk/conversions.html">Conversions</a> | <a href="http://aegmotorhomes.co.uk/refurbishment.html">Refurbishment</a> | <a href="http://aegmotorhomes.co.uk/contact.html">Contact us |</a></div>
    </div>
    <div id="navspacer"></div>
    <div id="navbar">
      <div id="tab_spacer"></div>
      <a href="http://aegmotorhomes.co.uk/swift.html"><img src="../MOTORHOME IMAGES/Tabs/1swift.jpg" alt="Swift Motorhomes" name="swift" width="107" height="26" border="0" id="swift" onmouseover="MM_swapImage('swift','','../MOTORHOME IMAGES/Tabs/2swift.jpg',1)" onmouseout="MM_swapImgRestore()" /></a><a href="http://aegmotorhomes.co.uk/escape.html"><img src="../MOTORHOME IMAGES/Tabs/1escape.jpg" alt="escape motorhomes" name="escape" width="107" height="26" border="0" id="escape" onmouseover="MM_swapImage('escape','','../MOTORHOME IMAGES/Tabs/2escape.jpg',1)" onmouseout="MM_swapImgRestore()" /></a><a href="http://aegmotorhomes.co.uk/autocruise.html"><img src="../MOTORHOME IMAGES/Tabs/1autocruise.jpg" alt="autocruise motorhomes" name="autocruise" width="107" height="26" border="0" id="autocruise" onmouseover="MM_swapImage('autocruise','','../MOTORHOME IMAGES/Tabs/2autocruise.jpg',1)" onmouseout="MM_swapImgRestore()" /></a><a href="http://aegmotorhomes.co.uk/used.html"><img src="../MOTORHOME IMAGES/Tabs/1used.jpg" alt="used motorhomes" name="used" width="107" height="26" border="0" id="used" onmouseover="MM_swapImage('used','','../MOTORHOME IMAGES/Tabs/2used.jpg',1)" onmouseout="MM_swapImgRestore()" /></a><a href="http://aegmotorhomes.co.uk/service.html"><img src="../MOTORHOME IMAGES/Tabs/1service.jpg" alt="motorhome service" name="service" width="107" height="26" border="0" id="service" onmouseover="MM_swapImage('service','','../MOTORHOME IMAGES/Tabs/2service.jpg',1)" onmouseout="MM_swapImgRestore()" /></a></div>
    <div id="youspacer"></div>
    <div id="you_are_here">You are here:<span class="fillin"> Fill in</span></div>
    <div id="spacer2"></div>
<div id="main_content">
<div id="Newstitle">AEG Motorhomes News & Updates
<div id="newstitletext"> AEG Motorhomes keeps you informed of all our latest offers and discounts on Motorhome and Campervan New & Used Sales, Service, Parts and Accessories. We will post all Motorhome events, Shows, model release dates and articles here. If you have any Motorhome news or articles you wish us to publish, please call our team on 01562 535 039 or alternatively you can email [email protected].</div>
</div>

<div id="Content_area">
<div id="Content_head">head</div>
<div id="content_text">text</div>
</div>
</div>
    <div id="sidebar">
      <div id="adverts">
        <p> </p>
      </div>
    </div>
    <div id="lowerspacer"></div>
</div>
</div>
<div id="content_space_bottom"></div>
<div id="floatspace"></div>
<div id="footer">
<div id="copyright_spacer"></div>
<div id="Copyright">
    <div id="copy_left_spacer"></div>
    <div id="copy"> © 2011 All Electric GaragesMotorhomes. All Rights Reserved</div>
    <div id="legal"></div>
    <div id="legal_space"><a href="http://aegmotorhomes.co.uk/accessibility.html">Accessibility</a> | <a href="http://aegmotorhomes.co.uk/privacy.html">Privacy</a> | <a href="http://aegmotorhomes.co.uk/legal.html">Legal</a></div>
</div>
<div id="bottom_link_spacer"></div>
<div id="footer_links">
    <div id="footlinks">
      <table width="100%" border="0" cellspacing="5">
        <tr>
          <td width="5"> </td>
          <td><a href="http://aegmotorhomes.co.uk/swift.html">Swift</a></td>
          <td><a href="http://aegmotorhomes.co.uk">Home</a></td>
          <td><a href="http://aegmotorhomes.co.uk/conversions.html">Conversions</a></td>
        </tr>
        <tr>
          <td width="5"> </td>
          <td><a href="http://aegmotorhomes.co.uk/escape.html">Escape</a></td>
          <td><a href="http://aegmotorhomes.co.uk/news.html">News</a></td>
          <td><a href="http://aegmotorhomes.co.uk/refurbishment.html">Refurbishment</a></td>
        </tr>
        <tr>
          <td width="5"> </td>
          <td><a href="http://aegmotorhomes.co.uk/autocruise.html">Autocruise</a></td>
          <td><a href="http://aegmotorhomes.co.uk/offers.html">Offers</a></td>
          <td><a href="http://aegmotorhomes.co.uk/service.html">Service</a></td>
        </tr>
        <tr>
          <td width="5"> </td>
          <td><a href="http://aegmotorhomes.co.uk/used.html">Used</a></td>
          <td><a href="http://aegmotorhomes.co.uk/brochures.html">Brochures</a></td>
          <td><a href="http://aegmotorhomes.co.uk/sitemap.html">Site map</a></td>
        </tr>
        <tr>
          <td width="5" height="20"> </td>
          <td><a href="http://aegmotorhomes.co.uk/trailertents.html">Trailer Tents</a></td>
          <td><a href="http://aegmotorhomes.co.uk/insurance.html">Insurance</a></td>
          <td><a href="http://aegmotorhomes.co.uk/contact.html">Contact us</a></td>
        </tr>
      </table>
    </div>
    <div id="socialspacer"></div>
    <div id="socialmedia"><a href="http://www.facebook.com/pages/All-Electric-Garages-Group/112905889042"><img src="../MOTORHOME IMAGES/Footer/facebook.jpg" alt="" name="facebook" width="40" height="40" border="0" id="facebook" /></a> <a href="http://twitter.com/#!/allelectricplc"><img src="../MOTORHOME IMAGES/Footer/twitter.jpg" alt="" name="twitter" width="40" height="40" border="0" id="twitter" /></a> <a href="http://www.youtube.com/user/allelectricgarages"><img src="../MOTORHOME IMAGES/Footer/youtube.jpg" alt="" name="youtube" width="40" height="40" border="0" id="youtube" /></a> <a href="http://allelectricgaragesplc.blogspot.com/"><img src="../MOTORHOME IMAGES/Footer/blogger.jpg" alt="" name="blogger" width="40" height="40" border="0" id="blogger" /></a></div>
</div>
<div id="footer_link_space"></div>
<div id="footer_details">
    <div id="bottom_logos">
      <div id="logo_bottom"><a href="http://aegmotorhomes.co.uk"><img src="../MOTORHOME IMAGES/Footer/3logosfootersquarenew.jpg" alt="Aeg Motorhome Logos" name="motorhomelogos" width="144" height="94" border="0" id="motorhomelogos" /></a></div>
      <div id="bottom_contact">All Electric Garages Motorhomes<br />
        Churchfields<br />
        Worcestershire<br />
        DY102JL<br />
        Tel: 01562 535 039<br />
        Email: [email protected]</div>
      <div id="clowe"><a href="http://aegmotorhomes.co.uk"><img src="../MOTORHOME IMAGES/Footer/Aeg Logodesigned blk.jpg" alt="Designed by CLowe" name="clowe" width="217" height="54" border="0" id="clowe2" /></a></div>
    </div>
</div>
</div>
</body>
</html>

You are posting to the wrong forum. For html/css layout issues try posting to the Dreamweaver forum.

EA 4.2 Two Level TabsLeft and Right Sidebar not highlighting the parent tab

Theme 24 Two Level Tabs - Left and Right Sidebar page template is not highlighting the parent tab. I did some changes to the Current Parent tab section and it is working so can we see the changes in the EA2 or the final 4.2 product.
Orginal
<li><a class="active" href="#TAB_LINK#">#TAB_LABEL#</a>#TAB_INLINE_EDIT#</li>
changed to
<li class="active">#TAB_LABEL##TAB_INLINE_EDIT#</li>

Log 4.2EA issues and comments using the Feedback link in the App Builder on apexea.oracle.com.

Nesting Template w/ Repeating Regions

I'm new to Dreamweaver so please bare with me. I am setting
up a nested template. On my first level template I have some
editable regions and some repeating regions that also have an
editable region inside. On the second level template I created some
more editable regions. I then create my actual html page from the
second level template, and on that page the editable regions are
ok, but the I don't have access to the repeating regions from the
first level template - they are static. Is that working as
expected? Is there any way I can make my repeating regions
pass-though also?
Thanks,
Ken

If you don't use nested templates, you never have to face
such mind-bending
issues. I have not yet found a scenario where I needed to use
nested
templates....
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"kldjsflksjfkljs" <[email protected]> wrote
in message
news:g43ebd$hni$[email protected]..
> Well, I figured out my problem. Part of the problem was
me just being
> stupid
>
. But in case anyone else ever wonders, the repeating
> region
> code cannot go in the master template. It must go in an
editable region of
> a
> template that the page is based directly on. As far as I
can tell there is
> no
> way to make it pass-through in the same way as you can
with optional
> regions.
> Too bad, I think. But hopefully I can work with it for
now.
>

Dreamweaver error on inserting an XSLT repeat region

I am getting a Dreamweaver JavaScript error message when
attempting to insert an XSLT Repeat Region under certain
circumstances in Dreamweaver 8.0.2 for Windows. I have posted a
full description on
David
Powers's friends of ED forum, but I wanted to report it here as
well for confirmation.
When creating a Repeat Region in an XSLT fragment, the
following error message appears:
While executing objetTag in XSLT_ForEach.htm, the following
JavaScript error(s) occurred: At line 502 of the file "C:\Program
Files\Macromedia\Dreamweaver
8\Configuration\Objects\Server\serverObjectsCommon.js": Type Error:
dwscripts.getBalancedSelection is not a function
This error is entirely reproducible,
but not if any PHP file has been open at any point since the
XSLT fragment was opened.
To illustrate:
0) If Dreamweaver is running, exit completely.
1) Start Dreamweaver.
2) Create a new XSLT fragment, or open an existing one.
3) In design view, place a field from an XML source into your
fragment, select it, and then try to create an XSLT repeat region.
The error message described above appears. Dismiss the error
dialog, but keep the XSLT fragment document open.
4) Create a new PHP document (or open an existing one), then
close it.
5) Back in your XSLT fragment, try again to create the repeat
region. Now it works.
If you open the PHP document
before creating the XSLT fragment, you still get the error
-- even if you leave the PHP document open. If you open the PHP
document
after you open the XSLT fragment, you do not get the error
-- even if you close the PHP document before you create the XSLT
repeat region.
It looks like
the key is to touch a PHP document at some point
after the XSLT fragment is opened. So that is the
workaround. My guess is that one of the included internal
JavaScript scripts is not being sourced until a PHP document is
opened, but this is probably not intended behavior.
-jon

quote:
Originally posted by:
Newsgroup User David Powers
The only way that I know of is to disable all extensions,
make sure that
Dreamweaver is working correctly, and then enable extensions
one by one
until the error occurs again. You have then found the guilty
party. You
could also try it the other way round - disabling extensions
one by one
until it works OK. If you have recently installed a new
extension, that
may be the one to test first.
Another thing you can try is this:
You can try this to see if it solves your problem:
Close Dreamweaver.
Find C:\Documents and Settings\<username>\Application
Data\Macromedia\Dreamweaver
8\Configuration\WinFileCache-*.dat
Delete the file (it's in a hidden folder, so you need to have
enabled
the option to see hidden files and folders).
Restart DW. See if your problem has gone away.
Thanks, David.
Actually, what I was looking for was a way to trace what
Dreamweaver is doing behind the scenes -- what scripts it is
loading, and what errors those scripts throw. I had already tried
uninstalling all my extensions and deleting my entire user
configuration directory (not just the WinFileCache file), to no
avail. I also tried running the "Repair" program from the Studio
installation, but the problem persisted.
So I resorted to uninstalling and reinstalling Dreamweaver
from scratch from the original Studio 8 CD.
Amazingly, even before I applied the 8.0.2 (or 8.0.1) update or
installed any hotfixes or extensions, the same error message
appeared.
Before reinstalling, I took care to delete my user
configuration directory (actually, I deleted the entire
C:\Documents and Settings\{Username}\Application
Settings\Macromedia\Dreamweaver 8/ tree. I took care to
uninstall Dreamweaver 8 completely using the uninstall program, and
I confirmed that the
C:\Program Files\Macromedia\Dreamweaver 8\ directory was
gone before reinstalling. In the outside chance that there was a
problem with my install CD itself, I even tried installing twice --
once from the install-image Studio 8 CD I downloaded from the
Macromedia Store after upgrading from MX 2004, and once from the
official Studio 8 CD I ordered by mail afterwards.
So it's not my installation, it's not the hotfix, and it's
not any of the extensions I've installed. It's a bona-fide bug.
(What I can't figure out is why David was not able to reproduce
it.)
Next?
-jon

Why does this happen when I insert editable region?

Hi ppl... I got a small problem here. When I insert editing region into the ORANGEBOX div, for some unknown reason which I can't figure out, my spry menu bar shifts to the left. But in preview, it looks fine. What's the reason for this and how can I avoid it? The shifted spry menu bar in the workspace is disturbing me.. haha.. I have attached screenshots of the 2 states below (Before inserting editable region and after inserting editable region)
Before inserting editable region into the ORANGE BOX
After inserting editable region into the ORANGEBOX
Here's the code BEFORE inserting editable region.. If you are free, do try to insert an editable region into the ORANGEBOX, and kindly tell me why it's happening! =) Thanks!
<!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" />

<title>Untitled Document</title>

<style type="text/css">

</style>


<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="wrapper">
<div id="header"></div>
<div id="navigationlinks">
    <ul id="MenuBar1" class="MenuBarHorizontal">
      <li><a href="#">Home</a>      </li>
      <li><a href="#">Audio Lectures</a></li>
      <li><a class="MenuBarItemSubmenu" href="#">Video Lectures</a>
        <ul>
          <li><a href="aqeedah1.htm">Aqeedah</a></li>
          <li><a href="fundamentals1.shtml">Tawheed</a></li>
<li><a href="#">Friday Bayans</a></li>
<li><a href="#">Other Topics</a></li>
        </ul>
      </li>
      <li><a href="#">Books</a></li>
    </ul>
</div>
<div id="mainContent">
    <p> </p>
    <p>mainContent</p>
    <p> </p>
    <div id="orangebox">
      <p>ORANGE BOX    </p>
      <p> </p>
    </div>
<p> </p>
    <p>mainContent</p>
    <p> </p>
    <p> </p>
</div>
<div id="footer">
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p>FOOTER </p>
    <p> </p>
    <p> </p>
    <p> </p>
</div>
<p> </p>
<p> </p>
</div>
<script type="text/javascript">

</script>
</body>
</html>

Here's the SpryMenuBarHorizontal.css
@charset "UTF-8";
/* SpryMenuBarHorizontal.css - version 0.6 - Spry Pre-Release 1.6.1 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
LAYOUT INFORMATION: describes box model, positioning, z-order
/* The outermost container of the Menu Bar, an auto width box with no margin or padding */
ul.MenuBarHorizontal
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    cursor: default;
    width: auto;
/* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
ul.MenuBarActive
    z-index: 1000;
/* Menu item containers, position children relative to this container and are a fixed width */
ul.MenuBarHorizontal li
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    position: relative;
    text-align: left;
    cursor: pointer;
    width: 9em;
    float: left;
/* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarHorizontal ul
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    z-index: 1020;
    cursor: default;
    width: 9em;
    position: absolute;
    left: -1000em;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
    left: auto;
/* Menu item containers are same fixed width as parent */
ul.MenuBarHorizontal ul li
    width: 9em;
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
ul.MenuBarHorizontal ul ul
    position: absolute;
    margin: -5% 0 0 95%;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
    left: auto;
    top: 0;
DESIGN INFORMATION: describes color scheme, borders, fonts
/* Submenu containers have borders on all sides */
ul.MenuBarHorizontal ul
    border: 1px solid #CCC;
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarHorizontal a
    display: block;
    cursor: pointer;
    color: #333;
    text-decoration: none;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    padding-top: 1.1em;
    padding-right: 0.75em;
    padding-bottom: 1.1em;
    padding-left: 0.75em;
    text-align: center;
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
    color: #FFF;
/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
    color: #FFF;
SUBMENU INDICATION: styles if there is a submenu under a given menu item
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenu
    background-image: url(SpryMenuBarDown.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
    background-image: url(SpryMenuBarRight.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
    background-repeat: no-repeat;
    background-position: 95% 50%;
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
    background-image: url(SpryMenuBarRightHover.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
BROWSER HACKS: the hacks below should not be changed unless you are an expert
/* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
ul.MenuBarHorizontal iframe
    position: absolute;
    z-index: 1010;
    filter:alpha(opacity:0.1);
/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
@media screen, projection
    ul.MenuBarHorizontal li.MenuBarItemIE
    display: inline;
    f\loat: left;

Repeating regions in tables

I am learning about adding dynamic data and have been through
a tutorial that demonstrates how to set up a table with one row,
and a repeating region that repeats the row so the my records would
appear like this:
1
2
3
4
5
6
But what if I have only one record element to display and I
want my records to appear like this:
1 2 3
4 5 6
How can I set up a repeating region to go left to right, top
to bottom , through a table?

> Is this the wrong way of doing it? Must be... it didn't
work, or did I do
> something wrong?
Would be hard to know if you did something wrong without
seeing your code,
but if you got the right number of rows, that would argue
against something
being wrong with the basic method you used. It sounds like it
should have
worked fine....
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"eclipsme" <[email protected]> wrote in message
news:fsh54r$nd0$[email protected]..
> You know... you struggle for hours, finally ask for
help, and the next
> thing you try works. Typical.
>
> I was able to make this work by creating a dynamic table
from the insert
> menu. I had been following directions to convert a table
row to a
> repeating region. Is this the wrong way of doing it?
Must be... it didn't
> work, or did I do something wrong?
>
> Thanks,
> Harvey
>
> eclipsme wrote:
>> I am just learning about database connections and
repeating regions.
>>
>> I have managed to setup a database connection and a
repeating region in a
>> table. I have created a recordset which when tested
produces the desired
>> records. However, when the page is loaded in the
browser, I get no data,
>> though I do get the correct number of rows.
>>
>> Any ideas?
>>
>> Harvey

Nested repeat region - multiple email recipients

Basically what I'm trying to do is to send a email made up of a dynamic table to some email recipients (5-20) from a database table.
This seemed like the right way to do it, but doesn't work correctly. The first email is sent correctly to the first email recipient. The second email is sent to the second recipient, but without any of the dynamic table.
My question is: How to make so that the dynamic info gets sent to every person. Is there a better way to have the "send email" function repeat?
It feels like I'm really close to a working solution, but have been struggling with this for a few hours without making any progress. Any help is greatly appreciated!
         <?php do { ?>
<?php
$sectemailObj = new tNG_EmailPageSection();
$sectemailObj->getCSSFrom(__FILE__);
$sectemailObj->setTo("{grain_closing_bids.email}");
$sectemailObj->setFrom("[email protected]");
$sectemailObj->setSubject("Closing Grain bids");
$sectemailObj->setFormat("HTML/Text");
$sectemailObj->setEncoding("ISO-8859-1");
$sectemailObj->setImportance("Normal");
$sectemailObj->BeginContent();
?>
      <p>Here's today's Closing Grain Bids.</p>
      <table width="400" border="0" cellpadding="3" cellspacing="0">
          <tr>
            <td></td>
            <td><h5><strong>Nearby Price</strong></h5></td>
            <td><h5><strong>Price Change</strong></h5></td>
            <td><h5><strong>Price on</strong></h5></td>
            <td><h5><strong>New Crop</strong></h5></td>
          </tr>
              <?php do { ?>
                <tr>
                  <td><?php echo $row_grain['title']; ?></td>
                  <td>$<?php echo $row_grain['price']; ?></td>
                  <td><?php echo $row_grain['price_change']; ?></td>
                  <td><?php echo $row_grain['price_on']; ?></td>
                  <td>$<?php echo $row_grain['new_crop']; ?></td>
                </tr>
                <?php } while ($row_grain = mysql_fetch_assoc($grain)); ?>
        </table>
      <?php
$sectemailObj->EndContent();
$sectemailObj->Execute();
?>                <?php } while ($row_grain_closing_bids = mysql_fetch_assoc($grain_closing_bids)); ?>

The emails get sent correctly. It's the repeating region in the email content that doesn't show after the first email. I think I may not have communicated what my problem is, as well as I could have.
The first email looked like this:
Nearby Price
Price Change
Price on
New Crop
Corn
$4.34
+0.16
06/05/09
$4.27
Hard Wheat
$6.25
+0.18
06/05/09
$
Milo
$3.79
+0.16
06/05/09
$
Oats
$2.00
+0.00
06/05/09
$
Soybeans
$12.00
+0.46
06/05/09
$9.97
the following emails look like this:
Nearby Price
Price Change
Price on
New Crop
$
$
Anyway, I fixed the problem when I inserted this code:
<?php
$rows = mysql_num_rows($Recordset1);
if($rows > 0) {
mysql_data_seek($Recordset1, 0);
$row_Recordset1 = mysql_fetch_assoc($Recordset1);
?>
This makes so the <tr> repeats again and again, not just in the first email.
Thanks for your help! Your replies were very helpful!

Nested Repeat Region (How to convert from table to list)

Sorry, i am really no PHP hero :-(
i created a menu with the "nested repeat region" wizzard. Now i want to change the HTML from TABLE to LIST.
I thought i just need to delete <table>- and <td>-tags, replace <tr> with <ul> and that's it. (But ist's NOT!)
This is my code:
------- START ----------------
<ul id="nav">
      <?php do { ?>
          <li><?php echo $row_master1waa_page_top['top_name']; ?></li>
        <?php
if ($totalRows_master1waa_page_top>0) {
    $nested_query_detail2waa_page_sub = str_replace("123456789", $row_master1waa_page_top['id_top'], $query_detail2waa_page_sub);
    mysql_select_db($database_WAA);
    $detail2waa_page_sub = mysql_query($nested_query_detail2waa_page_sub, $WAA) or die(mysql_error());
    $row_detail2waa_page_sub = mysql_fetch_assoc($detail2waa_page_sub);
    $totalRows_detail2waa_page_sub = mysql_num_rows($detail2waa_page_sub);
    $nested_sw = false;
    if (isset($row_detail2waa_page_sub) && is_array($row_detail2waa_page_sub)) {
      do { //Nested repeat
?>
          <ul>
            <li> <?php echo $row_detail2waa_page_sub['sub_head']; ?></li>
          </ul>
          <?php
      } while ($row_detail2waa_page_sub = mysql_fetch_assoc($detail2waa_page_sub)); //Nested move next
?>
        <?php } while ($row_master1waa_page_top = mysql_fetch_assoc($master1waa_page_top)); ?>
</ul>
------- END -----
The problem is located in line 3. the result is a list like this:
<ul id="nav">
     <li>xxx</li>
     <li>xxx</li>
          <ul>
                <li>xxx</li>
                <li>xxx</li>
          </ul>
     <li>xxx</li>
</ul>
Of course it will not work. I need the nested list inserted like this:
<ul id="nav">
     <li>xxx</li>
     <li>xxx
          <ul>
                <li>xxx</li>
                <li>xxx</li>
          </ul>
      </li>
     <li>xxx</li>
</ul>
Can someone please help me changing my code to get this result?

Hi,
I had trouble replying. I may be of some assistance until one of the Guru's get on.
The whole thing works on loops based inside do and while
EX.
<?php
          do{    //end php, use html
?>
I can repeat anthing here in HTML!
<?php } while ( /* some critera exist ex: i<5 */      ); ?>
so, your 'options' tag or LI' tags should only exist inside the first loop, check your { }
The entire LIST would repeat if you add the UL tags inside the nested loop area
You may find it easier to reaplace the table with div tags and then indent the sub or nested loop with a class
I don't have time to test this but try this:
<ul id="nav">
<ul>
<?php do { ?>
<li><?php echo $row_master1waa_page_top['top_name']; ?></li>
<?php
if ($totalRows_master1waa_page_top>0) {
    $nested_query_detail2waa_page_sub = str_replace("123456789", $row_master1waa_page_top['id_top'], $query_detail2waa_page_sub);
    mysql_select_db($database_WAA);
    $detail2waa_page_sub = mysql_query($nested_query_detail2waa_page_sub, $WAA) or die(mysql_error());
    $row_detail2waa_page_sub = mysql_fetch_assoc($detail2waa_page_sub);
    $totalRows_detail2waa_page_sub = mysql_num_rows($detail2waa_page_sub);
    $nested_sw = false;
    if (isset($row_detail2waa_page_sub) && is_array($row_detail2waa_page_sub)) { ?>
   <ul>
<?php do { //Nested repeat ?>
               <li> <?php echo $row_detail2waa_page_sub['sub_head']; ?></li>
        <?php } while ($row_detail2waa_page_sub = mysql_fetch_assoc($detail2waa_page_sub)); //Nested move next ?>
    </ul>
<?php
?>
        <?php } while ($row_master1waa_page_top = mysql_fetch_assoc($master1waa_page_top)); ?>
</ul>
Hit me back if its close but wonky..
J

Spry collapsible panel - repeating region

Hi,
I'm trying to make a repeating region that contains a spry
collapsable panel.
The problem is that i need to develop a way to automatically
increase the ID of the spry panel.
The problem I am encountering is that only the first
Collapsible Panel works properly. The remainder are displaying the
data, but will not open and close when their tabs are clicked. It
appears that all are being repeated as
id="CollapsiblePanel1".
Does anyone have a way to increment the Tab & Content
ID's?
On another forum, somebody has suggested using the following
PHP - although having never used PHP before, I am uncertain as to
where I insert this into my code:

bump

How can I use a Looper inside a Repeat Region?

I have a Dreamweaver standard Repeat Region applied to a HTML table containing two horizontal loopers. The HTML table is to display a list of company contacts for our members. The loopers display find for the first company but after that they stop. To key the loopers to the company Im using a trick mentioned by Günter Schenk in this thread: http://www.adobeforums.com/webx/.59b524b4/5. He calls it a sub query; at times I use to help myself by using some sort of "sub query" like the following
<br />
<br />Ive linked my looper recordset to the recordset used for the Repeat Region. Heres one of the looper queries:
<br />
<br />$KTColParam1_rsContactFeatures = "-1";
<br />if (isset($_SESSION["kt_login_id"])) {
<br />$KTColParam1_rsContactFeatures = $_SESSION["kt_login_id"];
<br />}
<br />mysql_select_db($database_RNW, $RNW);
<br />$query_rsContactFeatures = sprintf("SELECT DISTINCT list_feature.description_feature, company.id_company, contact_cnt.idpremissions_cnt FROM (((company LEFT JOIN company_to_feature ON company_to_feature.idcompany=company.id_company) RIGHT JOIN list_feature ON list_feature.id_list_feature=company_to_feature.idlistfeature) LEFT JOIN contact_cnt ON contact_cnt.idcompany_cnt=company.id_company) WHERE company.id_company='".$row_rsContactAll['id_company']."' AND company_to_feature.id_feature is not null AND contact_cnt.idpremissions_cnt=%s ORDER BY company.id_company ASC ", GetSQLValueString($KTColParam1_rsContactFeatures, "int"));
<br />$rsContactFeatures = mysql_query($query_rsContactFeatures, $RNW) or die(mysql_error());
<br />$row_rsContactFeatures = mysql_fetch_assoc($rsContactFeatures);
<br />$totalRows_rsContactFeatures = mysql_num_rows($rsContactFeatures);
<br />
<br />This is my link in both quires: WHERE company.id_company='".$row_rsContactAll['id_company']."'
<br />
<br />Heres the code for the connected looper:
<br />
<br /><?php<br />do { // horizontal looper version 3<br />?>
<br />
<br />
<br />
<br />
<br />As I said this works fine for the first item in the list but then it quits. Heres a screen shot of what I dont want: http://www.retirenw.com/images/help/looper_inside_repeat_region.gif
<br />
<br />Is there anyway to change the php for the loopers to make this work?
<br />
<br />Thanks for your help
<table>
<tr>
<td>
<img src="../images/bullet.gif" width="8" height="14" />
</td>
<td>
<?php echo $row_rsContactFeatures['description_feature']; ?>
</td><?php <br />$row_rsContactFeatures = mysql_fetch_assoc($rsContactFeatures);<br />if (!isset($nested_rsContactFeatures)) { <br />$nested_rsContactFeatures= 1;<br />}<br />if (isset($row_rsContactFeatures) && is_array($row_rsContactFeatures) && $nested_rsContactFeatures++ % 1==0) {<br />echo "</tr><tr>";<br />}<br />} while ($row_rsContactFeatures); //end horizontal looper version 3<br />?>
</tr>
</table>

I found an easy solution.
I moved my looper quires out of my head and into my bodyinside the repeat region (the Looper Wizard puts the quires in the head). I put the quires right before my looper code. Finally, I had to make sure my conditional regional code came after the looper quires but before the looper code.

Help with Spry Rating Widget within a Spry Repeating Region

My link http://www.youthinkyougotitbad.com
This is a long question, but it seems to me if answered somewhere it could help alot of people in the spry community creating comment boards as it uses three important spry widgets: rating, repeating, and tabbed panels. I am trying to use spry rating widget within a spry repeating region within a spry tabbed panel with xml. I was trying to go with the pulse light script (http://forums.adobe.com/message/3831721#3831721) but Gramps told me about the spry rating widget. But I have ran into a couple more problems. First, I couldnt find that much information on the forums or online about how to do the php page with the spry rating widget. None of these have any information on how to do it:
http://labs.adobe.com/technologies/spry/articles/rating_overview/index .html
http://labs.adobe.com/technologies/spry/articles/data_api/apis/rating. html
http://labs.adobe.com/technologies/spry/samples/rating/RatingSample.ht ml
And it seems that the official examples are so poor (or I am just ignorant, which def could be a possiblity) it shows
to set the initial rating value from the server, but uses a static value of 4
http://labs.adobe.com/technologies/spry/samples/rating/RatingSample.html
<span id="initialValue_dynamic" class="ratingContainer">
         <span class="ratingButton"></span>
         <span class="ratingButton"></span>
         <span class="ratingButton"></span>
         <span class="ratingButton"></span>
         <span class="ratingButton"></span>
         <input id="spryrating1_val" type="text" name="spryrating1" value="4" readonly="readonly" />
         <span class="ratingRatedMsg sample">Thanks for your rating!</span>
</span>
<script>
var initialValue_dynamic = new Spry.Widget.Rating("initialValue_dynamic", {ratingValueElement:'spryrating1_val'});
</script>
I finally found a site that has the php and mysql setup.
http://www.pixelplant.ro/en/articles/article-detail/article/adobe-widgets-for-download.htm l
But its not perfect. It has the same problem that I ran into with Pulse light, that you had to use php echo within the spry repeating region to set the initial value from the server:
<span id="spryrating1" class="ratingContainer">
         <span class="ratingButton"></span>
            <input type="text" id="ratingValue" name="dynamic_rate" value="<?php echo $row['average']?>"/>
        </span>
        <script type="text/javascript"
            var rating1 = new Spry.Widget.Rating("spryrating1", {ratingValueElement:'ratingValue', afterRating:'serverValue', saveUrl: 'save.php?id=spryrating1&val=@@ratingValue@@'});
        </script>
So instead, I tried with three of my panels (www.youthinkyougotitbad.com) to get the average rating from xml by using the following queries:
Recent
Returns the blurts in most recent order along with average rating
SELECT Blurt.Id_blurt, Blurt.Name, Blurt.Location, Blurt.Blurt,Blurt.`Date`,DATE_FORMAT(Blurt.`Date`, '%l:%i %p on %M %D, %Y') as Date, ratings.rating_id, Avg(ratings.rating_value) as average_r FROM ratings Left Join Blurt On ratings.rating_id = Blurt.Id_blurt Group By Id_blurt ORDER BY Blurt.`Date` DESC
Wet Eyed
Returns the blurts in highest ratings order along with the average rating
SELECT Blurt.Id_blurt, Blurt.Name, Blurt.Location, Blurt.Blurt, DATE_FORMAT(Blurt.`Date`, '%l:%i %p on %M %D, %Y') as Date, ratings.rating_id, Avg(ratings.rating_value) as average_r FROM ratings Left Join Blurt On ratings.rating_id = Blurt.Id_blurt AND ratings.rating_value > 0.1 Group By Id_blurt ORDER BY average_r Desc
Dry Eyed
Returns the blurts in lowest rating order along with the average rating
SELECT Blurt.Id_blurt, Blurt.Name, Blurt.Location, Blurt.Blurt, DATE_FORMAT(Blurt.`Date`, '%l:%i %p on %M %D, %Y') as Date, ratings.rating_id, Avg(ratings.rating_value) as average_r FROM ratings Left Join Blurt On ratings.rating_id = Blurt.Id_blurt AND ratings.rating_value > 0.1 Group By Id_blurt ORDER BY average_r
These all return the correct xml in the correct order.And they return the average rating of each blurt which I can send to my page with xml.
My first question is that I dont know how to configure the query on my fourth panel Empathized & Advised the same way because it already has a Group By for the Comment Id.
SELECT `Comment`.id_Blurt, COUNT(*) as frequency, Blurt.Id_blurt, Blurt.Name, Blurt.Location, Blurt.Blurt, DATE_FORMAT(Blurt.`Date`, '%l:%i %p on %M %D, %Y') as Date FROM Blurt, `Comment` WHERE Blurt.Id_blurt = `Comment`.id_Blurt GROUP BY `Comment`.id_Blurt ORDER BY COUNT(*) DESC";
Not sure if you guys need more information to understand that all, if so just ask.
So after I get my average value through xml to the first three panels, I set my spry repeating region up like this:
(Blurt panel)
<div spry:region="pv1" spry:repeatchildren="pv1">
           <div class="blurtbox">
            
            <h3> "{pv1::Blurt}"</h3>
            <p> Blurted from {pv1::Location} at {pv1::Date}</p>
            <p>Empathize or Advise about {pv1::Name}'s Blurt #<a href="detailblurt.php?blurtid={pv1::Id_blurt}"> {pv1::Id_blurt}</a></a></p>
           <span id="{pv1::Id_blurt}" class="ratingContainer">
            <span class="ratingButton"></span>
            <span class="ratingButton"></span>
            <span class="ratingButton"></span>
            <span class="ratingButton"></span>
            <span class="ratingButton"></span>
            <span class="ratingRatedMsg">Thank You! Your tears have been tallied.</span>
            <input type="text" id="ratingValue" name="dynamic_rate" value="{pv1::average_r}"/>
        </span>
        <script type="text/javascript">
            // overview of available options and their values:
            // http://labs.adobe.com/technologies/spry/articles/rating_overview/index.html
            var rating1 = new Spry.Widget.Rating("{pv1::Id_blurt}", {ratingValueElement:'ratingValue', afterRating:'serverValue', saveUrl: 'save.php?id={pv1::Id_blurt}&val=@@ratingValue@@'});
        </script>
             <br/>
           </div>
          </div>
Ok, it registers the right vote in the database with the right blurt id each time. But I am having two problems so far:
One, even though {pv1::average_r} returns the correct average through xml, it doesn't show the initial rating value for each of the repeating blurts. It seems to show the first one correct, and then just repeat that same value to the other ones that follow. I just dont understand since it can get the correct server value right after you vote (afterRating:'serverValue), that I can't manipulate spryrating.js in some way that I could just replace 'ratingValue' in ratingValueElement:'ratingValue' with something to give me the initial server value.
Two: Is even more mysterious to me, if you play around with voting on the site, sometimes you are unable to vote on different blurts. Its weird. It seems like that the javascript is completely off just on those blurts. And sometimes its a whole row, sometimes none. But so far its never a problem on the first tabbed panel (Recent), only on the other three. As far as I know, the coding is exactly the same in each tab's repeating region except for the different xml input.
And, now on the live server, sometimes the pics of tears used to voting dont show up until you click.
Any help on those three questions (how to query the fourth panel, how to show the initial server value, and the glitches with voting) would be greatly appreciated!! I looked pretty hard on adobe forums and other sites, and didnt see much on how to really use the spry rating widget with php and xml.
Thanks!!

Update:
Ok, the first query on the Recent tab doesnt work for me because it wont show unless its already voted, and since these are supposed to be new blurts, that kind of breaks the whole site:
"SELECT Blurt.Id_blurt, Blurt.Name, Blurt.Location, Blurt.Blurt,Blurt.`Date`,DATE_FORMAT(Blurt.`Date`, '%l:%i %p on %M %D, %Y') as Date, ratings.rating_id, Avg(ratings.rating_value) as average_r FROM ratings Left Join Blurt On ratings.rating_id = Blurt.Id_blurt Group By Id_blurt ORDER BY Blurt.`Date` DESC";
So I replaced it with what I originally had.
"SELECT Blurt.Id_blurt, Blurt.Name, Blurt.Location, Blurt.Blurt,Blurt.`Date`,DATE_FORMAT(Blurt.`Date`, '%l:%i %p on %M %D, %Y') as Date FROM Blurt ORDER BY Blurt.`Date` DESC";
But this doesn't provide me with the initial average rating:(

How to keep the right sidebar on this website from going under the main content (center) column?

Hi...is there a way to keep the right sidebar on this website from going under the main content (center) column when the browser window is made smaller? It would be great if the middle (main content) column could get smaller instead of the sidebar moving under the text when the window is made smaller. I'm working with a fluid layout and this is the first time I've tried this. Any help would be appreciated. Here is the link to the website:
http://www.elynncohen.com
and here is my code:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>Your Career Direction Career and College Counseling</title>
<meta name="Keywords" content="career counseling, college counseling, job search, career choice, college options, career options, work, jobs, new opportunities, career change, new career, new job" />
<meta name="Description" content="Your Career Direction :: Career and College Counseling" "Considering your college choices & career options" "Preparing for the world of work after college" "Seeking a new position to further your career"
"In-transition and considering new opportunities"
"Seeking to make a significant and meaningful career change" />
<meta name="Publisher" content="Your Career Direction, LLC" />
<meta name="Copyright" content="Copyright 2012, Your Career Direction, LLC. All rights reserved." />
<meta name="Author" content="Lisa Mark" />
<meta name="Language" content="en-US" />
<meta name="distribution" content="global" />
<meta name="revisit-after" content="10 days" />
<meta name="Robots" content="All" />
<link rel="Index" href="index.html" />
<link rel="Site Map" href="sitemap.html" />
<script type="text/javascript" src="//use.typekit.net/ifb2bte.js"></script>
<script type="text/javascript">try{Typekit.load();}catch(e){}</script>
<style type="text/css">

</style></head>
<body><script type="text/javascript">
function pageWidth() {
return window.innerWidth != null? window.innerWidth : document.documentElement && document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body != null ? document.body.clientWidth : null;
function pageHeight() {
return window.innerHeight != null? window.innerHeight : document.documentElement && document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body != null? document.body.clientHeight : null;
</script>
<div class="container">
<div class="header">
    <p class="clearfloat"><a href="#index.html" id="Insert_logo2"><img src="images/YCD-logo-tag-RGB-web-SM.gif" alt="Your Career Direction Logo" name="Insert_logo" width="50%" id="Insert_logo2" style="background: #FFF
    ; display:block;" /></a></p>
    <div id="Quote"><img src="images/quote.gif" alt="Choose a job you love" width="355" height="81"></div>
    <p class="clearfloat"> </p>
</div>
<div class="sidebar1">
    <ul class="nav">
      <li><a href="#">Home</a></li>
      <li><a href="#">High School Students</a></li>
      <li><a href="#">College Students</a></li>
      <li><a href="#">Parents/Educators</a></li>
      <li><a href="#">Professionals</a></li>
      <li><a href="#">Bio</a></li>
      <li><a href="#">Q & A Blog</a></li>
      <li><a href="#">Testimonials</a></li>
    </ul>
</div>
<div class="content">
<p>Given today's competitive job market, global economy, and changed corporate culture,
we can no longer depend upon others to ensure our professional futures. Choosing or
changing your career direction requires self-reflection, career education and an action plan.</p>
<img src="images/Whether-you-are-.gif" alt="Whether you are considering your college choices and career options" width="197" height="31" align="left">
<ul>
      <br><br><li><strong>Considering your college choices & career options</strong></li>
      <li><strong>Preparing for the world of work after college</strong></li>
      <li><strong>Seeking a new position to further your career</strong></li>
      <li><strong>In-transition and considering new opportunities</strong></li>
      <li><strong>Seeking to make a significant and meaningful career</strong> <strong>change</strong></li>
    </ul>
<img src="images/Onethingisforsureraster.gif" width="352" height="49" alt="One thing is for sure, we all want to direct our own careers, our own lives!">
<br><p> Building a successful and rewarding career requires linking your interests, education and experience with employment trends, growth industries, and career choices. It takes making smart decisions about your college major, vocational training and continuing education options. With enthusiasm, persistence and top notch job search skills, you can succeed in finding a path to career that is right for you.</p>
<p> We are your advocate. We listen, assess, strategize, inspire, counsel, and network on your behalf. With a personalized, holistic approach, we'll work with you to help you create an action plan; a path designed to get you to where you want to go and become what you want to be.</p>
<img src="images/yourcareerourpassionraster.gif" width="441" height="20" alt="At Your Career Direction, YOUR career is our passion!"> </div>
<div class="sidebar2">
    <p><img src="images/Counselingastudent.gif" width="100%" alt="Lisa Mark counseling a student"></p>
    <p>Our mission is to help you explore, choose and create your direction for an exciting and rewarding career path.</p>
     <p>We incorporate our experience with today's job market and career counseling expertise with your passions and interests. We'll introduce you to new career ideas, target companies and generate job and internship opportunities for you.</p>
     <p>We provide step by step guidance to ensure your success during the college application, job interview
and decision making process.
</p>
</div>
<div class="footer">
    <div id="footer">
      <h6 align="left"> Your Career Direction, LLC • 96 Harvard Avenue, Maplewood, N.J. 07040 • (973) 996-0207 • [email protected]</h6>
         </div>
    <p> </p>
</div>
</div>
</body>
</html>

You should make your sidebar1 and sidebar2 fixed positioned. Make your content DIV fluid.
This should help you: http://www.glish.com/css/7.asp

Tabbed panels repeat region in cms displays 2nd item as a block of content

Hi everyone, hope someone can help:
I have a test page live
http://aegmotorhomes.co.uk/usedtest1.php
Problem is this-
I have added a repeat region on my dreamweaver template
I use Perch CMS as my management for staff to add new items for sale on this page
I have built a tabbed panels to list the item
On my CMS it allows me to press "add another" which then adds the tabbed panels again as a new item and the staff input the details
My problem is the first item works perfect and all tabbs work fine, each item after that doesn't have tabbs and shows all content as one whole block
I think it is to do with the ID and applies the java file only to item one, thats my guess.
I have attached code below for my tabbed panels template, .js file and .css file - can anyone shed any light on this issue"
TEMPLATE
<style type="text/css">
#container1 {
          width: 700px;
          background-color: #E6E6E6;
          border: .1em solid #999;
          padding-top: 5px;
          padding-right: 5px;
          padding-left: 5px;
          height: auto;
          margin-bottom: 30px;
#item_description {
          font-family: Arial, Helvetica, sans-serif;
          font-size: 1.3em;
          color: #333;
          background-color: #FFF;
          height: 30px;
          border-bottom-width: .1em;
          border-bottom-style: dotted;
          border-bottom-color: #333;
          font-weight: bold;
          margin-bottom: 10px;
#price {
          margin-top: 5px;
          float: right;
          width: 150px;
          background-color: #EAEAEA;
          border: 0.1em solid #CCC;
.BOLDTEXT {
          font-weight: bold;
          text-align: center;
          color: #FFF;
.BOLDTEXT_PRICE {
          color: #333;
#engine_spec {
          float: left;
          width: 190px;
          font-family: Arial, Helvetica, sans-serif;
          font-size: .75em;
          border-top-style: none;
          border-right-style: none;
          border-bottom-style: none;
          border-left-style: none;
#top_price {
          font-family: Arial, Helvetica, sans-serif;
          font-size: 1.2em;
          color: #099;
          float: right;
          width: 150px;
          font-weight: bold;
          text-align: right;
#top_price {
          font-family: Arial, Helvetica, sans-serif;
          font-size: 1.4em;
          color: #099;
#overview_picture {
          height: 150px;
          width: 200px;
          background-color: #CCC;
          float: left;
          margin-right: 10px;
          margin-top: 5px;
.BOLDTEXT_blackprice {
          font-family: Arial, Helvetica, sans-serif;
          font-size: 1.4em;
          color: #099;
#smallprint {
          font-family: Arial, Helvetica, sans-serif;
          font-size: .5em;
          color: #666;
          margin-top: 2px;
table tr td {
          font-size: 0.75em;
          font-family: Arial, Helvetica, sans-serif;
.specwhite {
          color: #FFF;
          font-family: Arial, Helvetica, sans-serif;
          font-size: 1em;
          font-weight: bold;
#reserve {
          font-family: Arial, Helvetica, sans-serif;
          font-size: 1.2em;
          font-weight: bold;
          color: #FFF;
          background-color: #099;
          width: 140px;
          float: right;
          margin-top: 10px;
          padding: 5px;
          text-align: center;
          border: .1em solid #999;
</style>
<script src="../../../../SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
<link href="../../../../SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
<div id="container1">
<div id="TabbedPanels1" class="TabbedPanels">
    <ul class="TabbedPanelsTabGroup">
      <li class="TabbedPanelsTab" tabindex="0">Overview</li>
      <li class="TabbedPanelsTab" tabindex="0">Description</li>
      <li class="TabbedPanelsTab" tabindex="0">Images</li>
      <li class="TabbedPanelsTab" tabindex="0">Specification</li>
    </ul>
    <div class="TabbedPanelsContentGroup">
      <div class="TabbedPanelsContent">
        <div id="item_description"><perch:content id="Title1" label="Title" type="text" />
          <div id="top_price">£<perch:content id="Title2" label="Top Price" type="text" /></div>
        </div>
        <div id="overview_picture"><img src="<perch:content id="photo" label="Photo" type="image" />" class="photo" /></div>
        <div class="engine_spec" id="engine_spec">
          <table width="100%" border="0" cellpadding="5" cellspacing="7">
            <tr>
              <td width="35%" bgcolor="#EAEAEA">Year of Make</td>
              <td width="65%" bgcolor="#999999"><strong class="spec_white"><span class="engine_spec"><span class="specwhite"><perch:content id="Title3" label="Year" type="text" /></span></span></strong></td>
            </tr>
            <tr>
              <td bgcolor="#EAEAEA">Current Miles</td>
              <td bgcolor="#999999" class="spec_white"><span class="specwhite"><perch:content id="Title4" label="Mileage" type="text" /></span></td>
            </tr>
            <tr>
              <td bgcolor="#EAEAEA">Engine Size</td>
              <td bgcolor="#999999" class="spec_white"><span class="specwhite"><perch:content id="Title5" label="Engine" type="text" /></span></td>
            </tr>
            <tr>
              <td bgcolor="#EAEAEA">Body Colour</td>
              <td bgcolor="#999999" class="spec_white"><span class="specwhite"><perch:content id="Title6" label="Colour" type="text" /></span></td>
            </tr>
            <tr>
              <td bgcolor="#EAEAEA">Transmission</td>
              <td bgcolor="#999999" class="spec_white"><span class="specwhite"><perch:content id="Title7" label="Transmission" type="text" /></span></td>
            </tr>
          </table>
        </div>
        <div id="price">
          <table width="150" border="0" cellspacing="9">
            <tr>
              <td width="50" height="25" bgcolor="#999999" class="BOLDTEXT">WAS</td>
              <td width="81" class="BOLDTEXT"><span class="BOLDTEXT_blackprice">£<perch:content id="Title8" label="Old Price" type="text" /></span></td>
            </tr>
            <tr>
              <td height="25" bgcolor="#999999" class="BOLDTEXT">NOW</td>
              <td class="BOLDTEXT"><span class="BOLDTEXT_blackprice">£<perch:content id="Title9" label="New Price" type="text" /></span></td>
            </tr>
            <tr>
              <td height="25" bgcolor="#999999" class="BOLDTEXT">SAVE</td>
              <td class="BOLDTEXT"><span class="BOLDTEXT_blackprice">£<perch:content id="Title9a" label="Save" type="text" /></span></td>
            </tr>
          </table>
        </div>
        <div id="reserve">Reserve Motorhome</div>
      </div>
      <div class="TabbedPanelsContent"><perch:content id="Text" label="Description" type="textarea" editor="ckeditor" html="true" /></div>
      <div class="TabbedPanelsContent"><table width="650" cellspacing="5">
<tr>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
</tr>
<tr>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
</tr>
<tr>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
</tr>
<tr>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
</tr>
<tr>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
    <td width="106" height="80" bgcolor="#CCCCCC"> </td>
</tr>
</table></div>
      <div class="TabbedPanelsContent"><perch:content id="Text1" label="Specification" type="textarea" editor="ckeditor" html="true" /></div>
    </div>
</div>
</div>
<script type="text/javascript">
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
</script>
.JS file
(function() { // BeginSpryComponent
if (typeof Spry == "undefined") window.Spry = {}; if (!Spry.Widget) Spry.Widget = {};
Spry.Widget.TabbedPanels = function(element, opts)
          this.element = this.getElement(element);
          this.defaultTab = 0; // Show the first panel by default.
          this.tabSelectedClass = "TabbedPanelsTabSelected";
          this.tabHoverClass = "TabbedPanelsTabHover";
          this.tabFocusedClass = "TabbedPanelsTabFocused";
          this.panelVisibleClass = "TabbedPanelsContentVisible";
          this.focusElement = null;
          this.hasFocus = false;
          this.currentTabIndex = 0;
          this.enableKeyboardNavigation = true;
          this.nextPanelKeyCode = Spry.Widget.TabbedPanels.KEY_RIGHT;
          this.previousPanelKeyCode = Spry.Widget.TabbedPanels.KEY_LEFT;
          Spry.Widget.TabbedPanels.setOptions(this, opts);
          // If the defaultTab is expressed as a number/index, convert
          // it to an element.
          if (typeof (this.defaultTab) == "number")
                    if (this.defaultTab < 0)
                              this.defaultTab = 0;
                    else
                              var count = this.getTabbedPanelCount();
                              if (this.defaultTab >= count)
                                        this.defaultTab = (count > 1) ? (count - 1) : 0;
                    this.defaultTab = this.getTabs()[this.defaultTab];
          // The defaultTab property is supposed to be the tab element for the tab content
          // to show by default. The caller is allowed to pass in the element itself or the
          // element's id, so we need to convert the current value to an element if necessary.
          if (this.defaultTab)
                    this.defaultTab = this.getElement(this.defaultTab);
          this.attachBehaviors();
Spry.Widget.TabbedPanels.prototype.getElement = function(ele)
          if (ele && typeof ele == "string")
                    return document.getElementById(ele);
          return ele;
Spry.Widget.TabbedPanels.prototype.getElementChildren = function(element)
          var children = [];
          var child = element.firstChild;
          while (child)
                    if (child.nodeType == 1 /* Node.ELEMENT_NODE */)
                              children.push(child);
                    child = child.nextSibling;
          return children;
Spry.Widget.TabbedPanels.prototype.addClassName = function(ele, className)
          if (!ele || !className || (ele.className && ele.className.search(new RegExp("\\b" + className + "\\b")) != -1))
                    return;
          ele.className += (ele.className ? " " : "") + className;
Spry.Widget.TabbedPanels.prototype.removeClassName = function(ele, className)
          if (!ele || !className || (ele.className && ele.className.search(new RegExp("\\b" + className + "\\b")) == -1))
                    return;
          ele.className = ele.className.replace(new RegExp("\\s*\\b" + className + "\\b", "g"), "");
Spry.Widget.TabbedPanels.setOptions = function(obj, optionsObj, ignoreUndefinedProps)
          if (!optionsObj)
                    return;
          for (var optionName in optionsObj)
                    if (ignoreUndefinedProps && optionsObj[optionName] == undefined)
                              continue;
                    obj[optionName] = optionsObj[optionName];
Spry.Widget.TabbedPanels.prototype.getTabGroup = function()
          if (this.element)
                    var children = this.getElementChildren(this.element);
                    if (children.length)
                              return children[0];
          return null;
Spry.Widget.TabbedPanels.prototype.getTabs = function()
          var tabs = [];
          var tg = this.getTabGroup();
          if (tg)
                    tabs = this.getElementChildren(tg);
          return tabs;
Spry.Widget.TabbedPanels.prototype.getContentPanelGroup = function()
          if (this.element)
                    var children = this.getElementChildren(this.element);
                    if (children.length > 1)
                              return children[1];
          return null;
Spry.Widget.TabbedPanels.prototype.getContentPanels = function()
          var panels = [];
          var pg = this.getContentPanelGroup();
          if (pg)
                    panels = this.getElementChildren(pg);
          return panels;
Spry.Widget.TabbedPanels.prototype.getIndex = function(ele, arr)
          ele = this.getElement(ele);
          if (ele && arr && arr.length)
                    for (var i = 0; i < arr.length; i++)
                              if (ele == arr[i])
                                        return i;
          return -1;
Spry.Widget.TabbedPanels.prototype.getTabIndex = function(ele)
          var i = this.getIndex(ele, this.getTabs());
          if (i < 0)
                    i = this.getIndex(ele, this.getContentPanels());
          return i;
Spry.Widget.TabbedPanels.prototype.getCurrentTabIndex = function()
          return this.currentTabIndex;
Spry.Widget.TabbedPanels.prototype.getTabbedPanelCount = function(ele)
          return Math.min(this.getTabs().length, this.getContentPanels().length);
Spry.Widget.TabbedPanels.addEventListener = function(element, eventType, handler, capture)
          try
                    if (element.addEventListener)
                              element.addEventListener(eventType, handler, capture);
                    else if (element.attachEvent)
                              element.attachEvent("on" + eventType, handler);
          catch (e) {}
Spry.Widget.TabbedPanels.prototype.cancelEvent = function(e)
          if (e.preventDefault) e.preventDefault();
          else e.returnValue = false;
          if (e.stopPropagation) e.stopPropagation();
          else e.cancelBubble = true;
          return false;
Spry.Widget.TabbedPanels.prototype.onTabClick = function(e, tab)
          this.showPanel(tab);
          return this.cancelEvent(e);
Spry.Widget.TabbedPanels.prototype.onTabMouseOver = function(e, tab)
          this.addClassName(tab, this.tabHoverClass);
          return false;
Spry.Widget.TabbedPanels.prototype.onTabMouseOut = function(e, tab)
          this.removeClassName(tab, this.tabHoverClass);
          return false;
Spry.Widget.TabbedPanels.prototype.onTabFocus = function(e, tab)
          this.hasFocus = true;
          this.addClassName(tab, this.tabFocusedClass);
          return false;
Spry.Widget.TabbedPanels.prototype.onTabBlur = function(e, tab)
          this.hasFocus = false;
          this.removeClassName(tab, this.tabFocusedClass);
          return false;
Spry.Widget.TabbedPanels.KEY_UP = 38;
Spry.Widget.TabbedPanels.KEY_DOWN = 40;
Spry.Widget.TabbedPanels.KEY_LEFT = 37;
Spry.Widget.TabbedPanels.KEY_RIGHT = 39;
Spry.Widget.TabbedPanels.prototype.onTabKeyDown = function(e, tab)
          var key = e.keyCode;
          if (!this.hasFocus || (key != this.previousPanelKeyCode && key != this.nextPanelKeyCode))
                    return true;
          var tabs = this.getTabs();
          for (var i =0; i < tabs.length; i++)
                    if (tabs[i] == tab)
                              var el = false;
                              if (key == this.previousPanelKeyCode && i > 0)
                                        el = tabs[i-1];
                              else if (key == this.nextPanelKeyCode && i < tabs.length-1)
                                        el = tabs[i+1];
                              if (el)
                                        this.showPanel(el);
                                        el.focus();
                                        break;
          return this.cancelEvent(e);
Spry.Widget.TabbedPanels.prototype.preorderTraversal = function(root, func)
          var stopTraversal = false;
          if (root)
                    stopTraversal = func(root);
                    if (root.hasChildNodes())
                              var child = root.firstChild;
                              while (!stopTraversal && child)
                                        stopTraversal = this.preorderTraversal(child, func);
                                        try { child = child.nextSibling; } catch (e) { child = null; }
          return stopTraversal;
Spry.Widget.TabbedPanels.prototype.addPanelEventListeners = function(tab, panel)
          var self = this;
          Spry.Widget.TabbedPanels.addEventListener(tab, "click", function(e) { return self.onTabClick(e, tab); }, false);
          Spry.Widget.TabbedPanels.addEventListener(tab, "mouseover", function(e) { return self.onTabMouseOver(e, tab); }, false);
          Spry.Widget.TabbedPanels.addEventListener(tab, "mouseout", function(e) { return self.onTabMouseOut(e, tab); }, false);
          if (this.enableKeyboardNavigation)
                    // XXX: IE doesn't allow the setting of tabindex dynamically. This means we can't
                    // rely on adding the tabindex attribute if it is missing to enable keyboard navigation
                    // by default.
                    // Find the first element within the tab container that has a tabindex or the first
                    // anchor tag.
                    var tabIndexEle = null;
                    var tabAnchorEle = null;
                    this.preorderTraversal(tab, function(node) {
                              if (node.nodeType == 1 /* NODE.ELEMENT_NODE */)
                                        var tabIndexAttr = tab.attributes.getNamedItem("tabindex");
                                        if (tabIndexAttr)
                                                  tabIndexEle = node;
                                                  return true;
                                        if (!tabAnchorEle && node.nodeName.toLowerCase() == "a")
                                                  tabAnchorEle = node;
                              return false;
                    if (tabIndexEle)
                              this.focusElement = tabIndexEle;
                    else if (tabAnchorEle)
                              this.focusElement = tabAnchorEle;
                    if (this.focusElement)
                              Spry.Widget.TabbedPanels.addEventListener(this.focusElement, "focus", function(e) { return self.onTabFocus(e, tab); }, false);
                              Spry.Widget.TabbedPanels.addEventListener(this.focusElement, "blur", function(e) { return self.onTabBlur(e, tab); }, false);
                              Spry.Widget.TabbedPanels.addEventListener(this.focusElement, "keydown", function(e) { return self.onTabKeyDown(e, tab); }, false);
Spry.Widget.TabbedPanels.prototype.showPanel = function(elementOrIndex)
          var tpIndex = -1;
          if (typeof elementOrIndex == "number")
                    tpIndex = elementOrIndex;
          else // Must be the element for the tab or content panel.
                    tpIndex = this.getTabIndex(elementOrIndex);
          if (!tpIndex < 0 || tpIndex >= this.getTabbedPanelCount())
                    return;
          var tabs = this.getTabs();
          var panels = this.getContentPanels();
          var numTabbedPanels = Math.max(tabs.length, panels.length);
          for (var i = 0; i < numTabbedPanels; i++)
                    if (i != tpIndex)
                              if (tabs[i])
                                        this.removeClassName(tabs[i], this.tabSelectedClass);
                              if (panels[i])
                                        this.removeClassName(panels[i], this.panelVisibleClass);
                                        panels[i].style.display = "none";
          this.addClassName(tabs[tpIndex], this.tabSelectedClass);
          this.addClassName(panels[tpIndex], this.panelVisibleClass);
          panels[tpIndex].style.display = "block";
          this.currentTabIndex = tpIndex;
Spry.Widget.TabbedPanels.prototype.attachBehaviors = function(element)
          var tabs = this.getTabs();
          var panels = this.getContentPanels();
          var panelCount = this.getTabbedPanelCount();
          for (var i = 0; i < panelCount; i++)
                    this.addPanelEventListeners(tabs[i], panels[i]);
          this.showPanel(this.defaultTab);
})(); // EndSpryComponent
>CSS file
@charset "UTF-8";
/* SpryTabbedPanels.css - version 0.6 - 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 {
          overflow: hidden;
          margin: 0px;
          padding: 0px;
          clear: none;
          width: 100%; /* IE Hack to force proper layout when preceded by a paragraph. (hasLayout Bug)*/
/* 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: relative;
          top: 1px;
          float: left;
          background-color: #DDD;
          list-style: none;
          -moz-user-select: none;
          -khtml-user-select: none;
          cursor: pointer;
          font-family: sans-serif;
          font-size: small;
          font-weight: bold;
          margin-top: 0px;
          margin-right: 1px;
          margin-bottom: 0px;
          margin-left: 0px;
          padding-top: 4px;
          padding-right: 10px;
          padding-left: 10px;
          padding-bottom: 4px;
/* 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: #CCC;
/* 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 {
          background-color: #FFF;
          color: #333;
          border-top-color: fff;
          border-right-color: fff;
          border-bottom-color: fff;
          border-left-color: fff;
          border-color: fff;
          outline-color: fff;
/* 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;
          background-color: #F9F9F1;
          height: auto;
          margin-bottom: 3px;
          border: .1px solid #999;
/* 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 {
          overflow: hidden;
          padding: 4px;
/* 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;
          font-family: Arial, Helvetica, sans-serif;
          font-size: 0.75em;
          color: #333;
          padding: 20px;
          clear: both;
          margin-bottom: 5px;
          height: auto;
/* 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".
.VTabbedPanels {
          overflow: hidden;
          zoom: 1;
/* 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: #EEE;
          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;
/* Styles for Printing */
@media print {
.TabbedPanels {
          overflow: visible !important;
.TabbedPanelsContentGroup {
          display: block !important;
          overflow: visible !important;
          height: auto !important;
.TabbedPanelsContent {
          overflow: visible !important;
          display: block !important;
          clear:both !important;
.TabbedPanelsTab {
          overflow: visible !important;
          display: block !important;
          clear:none !important;
          height: 100%;
#TabbedPanels1 {
          height: auto;
          padding-top: 5px;
          background-color: #EAEAEA;
          width: 700px;
I did read this but don't know where to start: http://www.webdevforums.com/showthread.php?27428-Dreamweaver-spry-collapsible-panel-amp-re peating-regions
Can anybody HELP PLEASE PLEASE

I think I counted three tabbed panels in the markup, each with an ID of TabbedPanels1
You have only one constructor that makes one instance of the tabeed panels with an ID of TabbedPanels1
There are a couple of things that create the problem.
There can only be one ID with the same name in a document, thus the ID's of the TabbedPanels will need to change from TabbedPanels1 for the second and third instances to TabbedPanels2 and TabbedPanels3 (or similar) respectively.
There needs to be a constructor for each tabbed panels like
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
var TabbedPanels2 = new Spry.Widget.TabbedPanels("TabbedPanels2");
var TabbedPanels3 = new Spry.Widget.TabbedPanels("TabbedPanels3");
Gramps

Help I can't get my images and description from recordset to display in repeat region table

Hi everyone,
could somebody please help me, this is my first php and mysql website, I have a web page that is supposed to display a table with 2 rows 3 columns.
In each column i want an image, a description and a paypal button.
then i have a repeat region placed around the second row which should display 3 records at a time.
The recordset worked when I tested it several times, and the paypal button displays in the browser, but the image and the description won't display and the repeat region doesn't work either as only one button paypal button displays.
I have uploaded the actual page, in the hope that some could take a look and help me to find out what the problem is.
Thanks

In the second row, did you mean you want the three fields to display, not three records? A record is one row of data.
Start by getting a single row to display, and leave the paypal button out for now. So that means you will see the first record in your recordset, the image and description. To view the description, use the data bindings panel, expand the recordset and drag the description field onto the page in the table. For the image, insert and image placeholder and point the source to a dynamic data source. Again, choose the approprate field from your recordset.
Once that record is working, add your repeat region and test.
For the Paypal button, I am not sure if each button will carry the correct information with it in a repeat region. There has to be a way to dynamicall add the approprate data to the paypal link for each record. You may want to also incude checkboxes or radio buttons and have only 1 paypal button - but that introduces other issues which we can tackle later.

Trouble inserting repeating region as right sidebar in template

Similar Messages

Maybe you are looking for