Ask a Question related to Macromedia Exchange Dreamweaver Extensions, Design and Development.
-
nitefisher #1
Making Spyr Dynamic
Have searched for but could not find so I am asking:
Can someone clue me into how I can use a Collapsible Panel or Accordion Panel
in a PHP page using a mySQL recordset and display the data from the recordset
in the widget and have the widget work in a repeat region?
I am currently using a PHP page with a mySQL recordset and the data appears to
be properly passed, I am just haven't been able to dynamically id (name) the
Panel elements; and that, I think, is the problem.
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" (I am trying to use the Collapsible if possible rather
than the Accordion, but either would work)
Does anyone have a way either javascript or php or other technique to
increment the Tab & Content ID's?
I am attaching (I hope) a portion of the code i am testing with. Sorry, it's
on a local server on my machine.
An example of something I think I want to do can be seen at Adobe example page
:
[url]http://labs.adobe.com/technologies/spry/samples/accordion/AccordionSample2.html[/url]
Any direction would be appreciated.
Thanks,
nitefisher1
Attach Code
<title>collapsible</title>
<script src="SpryAssets/SpryCollapsiblePanel.js"
type="text/javascript"></script>
<link href="SpryAssets/SpryCollapsiblePanel.css" rel="stylesheet"
type="text/css" />
</head>
<body>
<?php do { ?>
<div id="CollapsiblePanel1" class="CollapsiblePanel">
<div class="CollapsiblePanelTab" tabindex="0"><?php echo
$row_rsPanel['gTitle']; ?> <?php echo $row_rsPanel['gAges']; ?></div>
<div class="CollapsiblePanelContent">
<div id=".ssCollapseLeft">
<p><?php echo $row_rsPanel['gTeachers1']; ?> <?php echo
$row_rsPanel['gTeachers2']; ?> </p>
</div>
<div id=".ssCollapseRight">
<p><?php echo $row_rsPanel['gLocation']; ?></p>
<p><?php echo $row_rsPanel['gDate']; ?></p>
<p><?php echo $row_rsPanel['gAttend']; ?></p>
<p><?php echo $row_rsPanel['gContact']; ?></p>
</div>
<div id=".ssCollapseClear">
<p><!--<!--clear div -->
</p>
</div>
</div>
</div>
<?php } while ($row_rsPanel = mysql_fetch_assoc($rsPanel)); ?><script
type="text/javascript">
<!--
var CollapsiblePanel1 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel1",
{contentIsOpen:false});
//-->
</script>
</body>
</html>
<?php
mysql_free_result($rsPanel);
?>
nitefisher Guest
-
Making dynamic pages static
I need to build a static site (user requirement) with DW template but a number of the pages will contain the same information - a perfect... -
Making a dynamic web service call
Hi, Is there a way to connect to a Web Service dynamically at runtime (Web Reference URL)? I have always used Visual Studio to create a Web... -
Making a dynamic button
I am bringing into flash xml files via a web service connector and a data set component. Bound to these are are various components to retreive... -
Making XMLConnector URLs dynamic
Is it possible to make the URL of the XMLConnector component dynamic so that I'm able to change parameters in the XMLConnector's URL. The parameters... -
Drop down menu and making it dynamic
Hi All, I have created a Popup menu using Dreamweaver through behaviours. The issue is the menu is bit lengther and when the menu is displayed... -
danilocelic AdobeCommunityExpert #2 Re: Making Spyr Dynamic
nitefisher wrote:
All you need to do is to create a counter and output the counter in place of the "1" in CollapsiblePanel1.> Does anyone have a way either javascript or php or other technique to
> increment the Tab & Content ID's?
What I would do to make this quick and easy would be to move the constructor code (the script tag and its contents) into your repeat region. This will allow you to not have to have multiple repeat regions (as well as a recordset "reset"). Then change your code to something like the following:
<title>collapsible</title>
<script src="SpryAssets/SpryCollapsiblePanel.js"
type="text/javascript"></script>
<link href="SpryAssets/SpryCollapsiblePanel.css" rel="stylesheet"
type="text/css" />
</head>
<body>
<?php
$counter = 1;
?>
<?php do { ?>
<div id="CollapsiblePanel1" class="CollapsiblePane<?php echo $counter; ?>">
<div class="CollapsiblePanelTab" tabindex="0"><?php echo
$row_rsPanel['gTitle']; ?> <?php echo $row_rsPanel['gAges']; ?></div>
<div class="CollapsiblePanelContent">
<div id=".ssCollapseLeft">
<p><?php echo $row_rsPanel['gTeachers1']; ?> <?php echo
$row_rsPanel['gTeachers2']; ?> </p>
</div>
<div id=".ssCollapseRight">
<p><?php echo $row_rsPanel['gLocation']; ?></p>
<p><?php echo $row_rsPanel['gDate']; ?></p>
<p><?php echo $row_rsPanel['gAttend']; ?></p>
<p><?php echo $row_rsPanel['gContact']; ?></p>
</div>
<div id=".ssCollapseClear">
<p><!--<!--clear div -->
</p>
</div>
</div>
</div>
<script
type="text/javascript">
<!--
var CollapsiblePanel<?php echo $counter; ?> = new Spry.Widget.CollapsiblePanel("CollapsiblePanel<?ph p echo $counter; ?>",
{contentIsOpen:false});
//-->
</script>
<?php
$counter++;
?>
<?php } while ($row_rsPanel = mysql_fetch_assoc($rsPanel)); ?>
</body>
</html>
<?php
mysql_free_result($rsPanel);
?>
Or instead of using the script block, you could try a Collapsible Panel group. Basically, you'd wrap around all of your panels (which you'd still need the counter for that) a div:
<div id="CollapsiblePanelGroup1" class="CollapsiblePanelGroup">
all your panel creation code here
</div>
Then in a script block at the bottom of the page:
<script language="JavaScript" type="text/javascript">
var cpg1 = new Spry.Widget.CollapsiblePanelGroup("CollapsiblePane lGroup1");
</script>
Check out the Spry sample page for more info on the panel group (this isn't an option in the Insert bar, but it is available in the Spry framework itself):
[url]http://labs.adobe.com/technologies/spry/samples/collapsiblepanel/CollapsiblePanelGroupSample.html[/url]
Not sure where you searched or have asked your question, but dynamic type questions are generally better handled in the App Dev forum:
[url]http://www.adobe.com/cfusion/webforums/forum/categories.cfm?forumid=12&catid=263&entercat=y[/url]
And perhaps ask questions that are specific to Spry in the Spry forums:
[url]http://www.adobe.com/cfusion/webforums/forum/categories.cfm?forumid=72&catid=602[/url]
HTH
--
Danilo Celic
| [url]http://blog.extensioneering.com/[/url]
| Adobe Community Expert
danilocelic AdobeCommunityExpert Guest
-
nitefisher #3 Re: Making Spyr Dynamic
:embarrassment;
Sorry about the search...and thanks for the Spry Forum link ... did not know
that existed.
I am still new to the Adobe Forums and all of the intricacies.
Thank you Danilo...I will try these fixes and see what becomes. I am certain
they will be of help.
Thanks again,
nitefisher1
:smile;
nitefisher Guest
Reply With QuoteSimilar Questions and Discussions
Posting Permissions
- You may not post new threads
- You may post replies
- You may not post attachments
- You may not edit your posts
