Linking to a specific spry tab in design view

hi there,
I am a dreamweaver novice and i only use design view for the most part. I am trying to make a link from some content in one tab to another tab. I looked up many such threads and they say that the spryurlutils.js is to be used. I do not know how and where to insert the script, because that area is uneditable in the code view. Here is the link to the URL.
http://192.168.17.13/testpagetraining.html
In the 'About training' tab, in the 2nd paragraph , there are the words "The Partnership".
I would like to make a link to the 3rd tab "The Partnership" from those words in the first tab.
Thanks.
A

I cannot open the page at the location you specified, it looks like a local server.
I you want a tutorial on the subject, have a look here http://foundationphp.com/tutorials/spry_url_utils.php

Similar Messages

Linking to specific spry tabbed panel - code not working

Hi,
I have followed the tutorial at
http://foundationphp.com/tutorials/spry_url_utils.php
with regard to being able to link to a specific tab. For some
reason though, my code doesn't work. I am usign Dreamweaver cs3,
and as soon as I head back to the design view, or preview it in a
browser for that matter, all I see is each tab one above the other,
and the tabs no longer work.
My code is as follows:
<script src="../SpryAssets/SpryTabbedPanels.js"
type="text/javascript"></script>
<link href="../SpryAssets/SpryTabbedPanels.css"
rel="stylesheet" type="text/css" />
<style type="text/css">
<script type="text/javascript"
src="SpryAssets/SpryURLUtils.js"></script>
<script type="text/javascript"> var params =
Spry.Utils.getLocationParamsAsObject(); </script>
is in the head, and the body for the tabbed panels is:
<div id="mainContent">
<div id="TabbedPanels1" class="TabbedPanels">
<ul class="TabbedPanelsTabGroup">
<li class="TabbedPanelsTab" tabindex="0">1st
Team</li>
<li class="TabbedPanelsTab" tabindex="0">2nd
Team</li>
<li class="TabbedPanelsTab" tabindex="0">3rd
Team</li>
<li class="TabbedPanelsTab" tabindex="0">4th
Team</li>
</ul>
<div class="TabbedPanelsContentGroup">
<div class="TabbedPanelsContent">
<table width="100%" border="1" cellpadding="5"
cellspacing="1px" bordercolor="#929925">
<tr>
<td width="54%">
<div align="center" class="style3 style5">Player
name</div>

<p align="center"><img alt="" name="playerpic" width="180"
height="245" border="1" id="playerpic" /></p>

<p align="center" class="style3 style6 style4">Click a
player name to view their profile. </p>

<p align="center"> </p></td>
<td width="46%"><p align="center"><img alt=""
name="teamphoto" width="250" height="150" border="1" align="top"
id="teamphoto" /></p>
<p align="center" class="style3 style4
style6"><u>Squad list</u></p>
<p align="center" class="style5"> </p>
<p></p></td>
</tr>
</table>
<p> </p>
<p> </p>
</div>
<div class="TabbedPanelsContent">
<table width="100%" border="1" cellpadding="5"
cellspacing="1px" bordercolor="#929925">
<tr>
<td width="54%">
<div align="center" class="style3"><span
class="style5">Player name</span></div>
<p align="center"><img alt="" name="playerpic" width="180"
height="245" border="1" id="playerpic2" /></p>

<p align="center" class="style3 style4 style6">Click a
player name to view their profile.</p>
</td>
<td width="46%"><p align="center"><img alt=""
name="teamphoto" width="250" height="150" border="1" align="top"
id="teamphoto2" /></p>
<p align="center" class="style3 style4
style6"><u>Squad list</u></p>
<p align="center"> </p>
<p></p></td>
</tr>
</table>
</div>
<div class="TabbedPanelsContent">
<table width="100%" border="1" cellpadding="5"
cellspacing="1px" bordercolor="#929925">
<tr>
<td width="54%">
<p align="center" class="style3 style6 style4">Player
name</p>

<p align="center"><img alt="" name="playerpic" width="180"
height="245" border="1" id="playerpic3" /></p>

<p align="center" class="style3 style6 style4">Click a
player name to view their profile.</p>

<p align="center"> </p></td>
<td width="46%"><p align="center"><img alt=""
name="teamphoto" width="250" height="150" border="1" align="top"
id="teamphoto3" /></p>
<p align="center" class="style3 style4
style6"><u>Squad list</u></p>
<p align="center"> </p>
<p></p></td>
</tr>
</table>
</div>
<div class="TabbedPanelsContent">
<table width="100%" border="1" cellpadding="5"
cellspacing="1px" bordercolor="#929925">
<tr>
<td width="54%">
<div align="center" class="style3 style4
style6">Player name</div>

<p align="center"><img alt="" name="playerpic" width="180"
height="245" border="1" id="playerpic4" /></p>

<p align="center" class="style3 style4 style6">Click a
player name to view their profile.</p>

<p align="center"> </p></td>
<td width="46%"><p align="center"><img alt=""
name="teamphoto" width="250" height="150" border="1" align="top"
id="teamphoto4" /></p>
<p align="center" class="style3 style4
style6"><u>Squad list</u></p>
<p align="center" class="style5"> </p>
<p></p></td>
</tr>
</table>
</div>
</div>
</div>
<p> </p>
</div>
<script type="text/javascript">
<!--
var TabbedPanels1 = new
Spry.Widget.TabbedPanels("TabbedPanels1", {defaultTab:(params.tab ?
params.tab : 0)});
The link I would then use to link to tab 2 say, would be:
../"pagename".php?tab=2#TabbedPanels2
Also, when I then go to click on the Spry tabbed panels
region in design view, I get an error message saying:
while executing inspectSelection in spry_tabbedpanels.htm, a
javascript error occurred.
I am pretty inexperienced with Spry and Java so I may have
missed something simple.
A solution would be much appreciated as this is driving me
mad!
Please let me know if you need me to post more code.
Thanks in advance.
p.s. I am using Dreamweaver CS3 and the SpryURLUtils.js
script is from the Spry 1.6.1 prerelease framework.

quote:
Originally posted by:
brownie_jedi
Ok, so I've just changed the code to <script
type="text/javascript"
src="../SpryAssets/SpryURLUtils.js"></script>
to mimic the code for <script
src="../SpryAssets/SpryTabbedPanels.js"
type="text/javascript"></script>
since the spry files are all in the same folder. Is this what
you meant?
Having just installed firebug, I get the error params is not
defined. So I guess that this all together means that the
SpryURLUtils.js file is not being called correctly?
p.s. Thanks for the speedy replies, much appreciated.
Yes it means it cant find the file SpryURLUtils.js.
in firebug theres a tab called scripts, if u click on it, u
can see wich scripts are loaded. i suggest u check that out. Or
post a online URL so we can see the problem for our selfs..

Pemanent link to specific spry tab

Hi,
I have a webpage that containd dynamically loaded spry tabs.
I need to creat a permanent link to a specific tab on that page
from my server for a different domain. What I have been tryiong to
do is write a normal link to use for this, something like:
http://
www.XXX.com?TabbedPanels1.showPanel(13);getPage('FrameSiten', '
http://XXX.com/directory/index.php'
but of course that will not work...
The tab is setup like this :
<div id="TabbedPanels1" class="TabbedPanels">
<ul class="TabbedPanelsTabGroup">
<li class="TabbedPanelsTab" tabindex="9"
onClick="getPage('FrameSiten', '
http://XXX.com/directory/index.php')">Directory</li>
Can anyone please help me with this as I have now searched
hundreds of pages on the web and found nothing that I can make
sence of...
Thanks

Add something like this under your tabbed panels constructor;
if(params.panel){
switch(params.panel){
case 1: getPage('FrameSiten', 'directoryindex.php');
break;
case 2: getPage('FrameSiten', 'whatever.php');
break;
case 3: getPage('FrameSiten', 'whatever.php');
break;
case 4: getPage('FrameSiten', 'whatever.php');
break;
case 5: getPage('FrameSiten', 'whatever.php');
break;
case 6: getPage('FrameSiten', 'whatever.php');
break;
default: null;
break;
(change the getPage to the event that matches the tab
number)

ANN: Linking to non-default Spry tab or panel - tutorial

Spry 1.6 includes a file called SpryURLUtil.js that makes it
easy to
link to a specific tab or panel in a Tabbed Panels or
Accordion widget.
I've created a step-by-step tutorial explaining how to use
it. You can
find it on my site at the following URL:
http://foundationphp.com/tutorials/spry_url_utils.php
David Powers, Adobe Community Expert
Author, "The Essential Guide to Dreamweaver CS3" (friends of
ED)
Author, "PHP Solutions" (friends of ED)
http://foundationphp.com/

That should be built in, as it is in all PVII Widgets.
Being how Spry has grown to be such an important part of your
books and
other writings, perhaps you would agree (and maybe even be
able to influence
Adobe) that what Spry needs is a re-writing rather than
updates.
Al Sparber - PVII
http://www.projectseven.com
Extending Dreamweaver - Nav Systems | Galleries | Widgets
Authors: "42nd Street: Mastering the Art of CSS Design"
"David Powers" <[email protected]> wrote in message
news:fokosr$l1e$[email protected]..
> Spry 1.6 includes a file called SpryURLUtil.js that
makes it easy to link
> to a specific tab or panel in a Tabbed Panels or
Accordion widget. I've
> created a step-by-step tutorial explaining how to use
it. You can find it
> on my site at the following URL:
>
>
http://foundationphp.com/tutorials/spry_url_utils.php
>
> --
> David Powers, Adobe Community Expert
> Author, "The Essential Guide to Dreamweaver CS3"
(friends of ED)
> Author, "PHP Solutions" (friends of ED)
>
http://foundationphp.com/

Change text "link" color only in Spry Tab content area

I need to have multiple text link colors in my site for light
and dark background colors. The only regions in my site that have a
white background are in the Spry Tab Panel content area. I can't
figure out how to change the text color for text links in the spry
content only. I tried to add a:link ..etc... to the style sheet,
but it did not effect anything
(I also need to clean my style sheet (s). But that comes
next.
Here
is a Link to a Sample Page in my site
null

Here is the SpryTabbedPanels style sheet in my site. I can't
seem to figure out the changes I need to make to effect the content
area.
I tried to add the following (see .TabbedPanelsContentGroup
below)
a: link {
color: #0099CC;
text-decoration: none
a:active {
color: #99CC33;
text-decoration: none
a:visited {
color: #0099CC;
text-decoration: none
a:hover {
color: #99CC33;
text-decoration: underline
@charset "UTF-8";
/* SpryTabbedPanels.css - version 0.4 - Spry Pre-Release 1.6
/* 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 {
margin: 0px;
float: right;
clear: none;
width: 82%; /* IE Hack to force proper layout when preceded
by a paragraph. (hasLayout Bug)*/
padding-top: 0px;
padding-right: 0px;
padding-bottom: 2px;
padding-left: 0px;
/* 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;
padding: 4px 10px;
margin: 0px 1px 0px 0px;
background-color: #CCCC99;
list-style: none;
border-left: solid 1px #CCC;
border-bottom: solid 1px #999;
border-top: solid 1px #999;
border-right: solid 1px #999;
-moz-user-select: none;
-khtml-user-select: none;
cursor: pointer;
font-family: sans-serif;
font-size: 12px;
font-weight: bold;
color: #000000;
/* 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: #99CC33;
color: #000000;
/* 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: #FFFFFF;
border-bottom: 1px solid #EEE;
color: #000000;
/* This selector is an example of how to make a link inside
of a tab button
* look like normal text. Users may want to use links inside
of a tab button
* so that when it gets focus, the text *inside* the tab
button gets a focus
* ring around it, instead of the focus ring around the
entire tab.
.TabbedPanelsTab a {
color: black;
text-decoration: none;
/* This is the selector for the ContentGroup. The
ContentGroup container houses
* all of the content panels for each tabbed panel in the
widget. For our
* default style, this container provides the background
color and borders that
* surround the content.
* The name of the class ("TabbedPanelsContentGroup") used in
this selector is
* not necessary to make the widget function. You can use any
class name you
* want to style the ContentGroup container.
.TabbedPanelsContentGroup {
clear: both;
border-left: solid 1px #CCC;
border-bottom: solid 1px #CCC;
border-top: solid 1px #999;
border-right: solid 1px #999;
background-color: #FFFFFF;
color: #000000;
a: link {
color: #0099CC;
text-decoration: none
a:active {
color: #99CC33;
text-decoration: none
a:visited {
color: #0099CC;
text-decoration: none
a:hover {
color: #99CC33;
text-decoration: underline
/* This is the selector for the Content panel. The Content
panel holds the
* content for a single tabbed panel. For our default style,
this container
* provides some padding, so that the content is not pushed
up against the
* widget borders.
* The name of the class ("TabbedPanelsContent") used in this
selector is
* not necessary to make the widget function. You can use any
class name you
* want to style the Content container.
.TabbedPanelsContent {
padding: 4px;
/* 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 {
/* Vertical Tabbed Panels
* The following rules override some of the default rules
above so that the
* TabbedPanels widget renders with its tab buttons along the
left side of
* the currently active content panel.
* With the rules defined below, the only change that will
have to be made
* to switch a horizontal tabbed panels widget to a vertical
tabbed panels
* widget, is to use the "VTabbedPanels" class on the
top-level widget
* container element, instead of "TabbedPanels".
/* This selector floats the TabGroup so that the tab buttons
it contains
* render to the left of the active content panel. A border
is drawn around
* the group container to make it look like a list container.
.VTabbedPanels .TabbedPanelsTabGroup {
float: left;
width: 10em;
height: 20em;
background-color: #CCCC99;
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: #CCCC99;
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;

Targeting a specific Spry tab in an A Href

Can i somehow tell the Spry tabs to focus on a tab other than
the first one on page load?

Due to the Spry framework being fairly new, you may be best
asking this
question in the Spry specific forum:
http://www.adobe.com/cfusion/webforums/forum/categories.cfm?forumid=72&catid=602
Nadia
Adobe® Community Expert : Dreamweaver
CSS Templates |Tutorials |SEO Articles
http://www.DreamweaverResources.com
~ Customisation Service Available ~
http://www.csstemplates.com.au
"jasals" <[email protected]> wrote in
message
news:f5e38m$dnu$[email protected]..
> Can i somehow tell the Spry tabs to focus on a tab other
than the first
> one on page load?

Linking text on one spry tab to another spry tab on the same page

Before I get to my question, let me say that I have already searched the forum and did not find anything that helped me out. I found information about doing this in CS3. I have CS5. While it is probably very similar, I don't know javascript, compounding my confusion.
My page in question is http://www.abilityaxis.com/expo.html
The page uses spry tabs. I have two places on the Employers tab that I wish to link to the Exhibitors tab and the Program tab respectfully. Since I haven't figured out how to do this yet, I created anchors to the top of the Employers tab, so that users can just click on the required tab. Not effecient.
What I need is plain english explaination.
Can you please help me?
thanks in advance,
Deb

No, unfortunately, that doesn't work.
I had tried almost the same thing this morning after I got your first reply.
<a href="#exhibitors" onclick="TabbedPanels1.showPanel(1);">Exhibitors tab above</a>
and
<a href="#program" onclick="TabbedPanels1.showPanel(1);">Exhibitors tab above</a>
(The Expo anchor is acutally at the top of the Expo page, not in the tabs.)
I tried a couple of other things, which now seem silly, but they obviously didn't work either.
I really appreciate your help.
You have been so helpful. I am just happy I am getting onto the right tab.
Regards,
deb

Linking to a Specific Spry panel (modified for RSS Reader)

Hi – I would like to implement the following tutorial however have it work for the Spry Framework RSS Reader: http://foundationphp.com/tutorials/spry_url_utils.php
I understand the concept of this article and have been able to implement the solution up to step 4 however for my solution I am not working with tabbed panels or an accordion widget but the RSS Reader from the latest Spry Framework. I would like to have a specific feed and article selected on the page depending on what link the user has come from.
So instead of working with the tabbed panel and accordion variables I would be using the variables:
var dsCategories
var dsFeeds
var dsChannel
var dsArticles
I would like to know if anyone can assist me in modifying the solution to suit this scenario? or if it is even possible?
Thanks.
Michael.

Hi Ben,
Thanks for pointing me to this tutorial.
To keep things easier for myself I have kept the variable name as row. I have added the following code to the head of my called page:
On lines 9-10:
<script type="text/javascript" src="js/SpryURLUtils.js"></script>
<script type="text/javascript"> var params = Spry.Utils.getLocationParamsAsObject();</script>
On lines 19-26:
//define the data set
            var ds1 = new Spry.Data.XMLDataSet("data/LocalFeeds.xml", "feeds/feed");
            //get the url parameter for the row number
            var params = Spry.Utils.getLocationParamsAsObject();
            //set an observer so that when the data is loaded, we update the current row to the url param value
            ds1.addobserver({ onPostLoad: function(ds, type) {
                                                                                                                            ds1.setCurrentRow(params.row); }
Currently my called page is still not loading in the wanted state with calling page passing the parameter row=2.
I aren’t sure what I am still missing but think it is perhaps something to do with setting the spry:region and spry:repeat to equal ds1? But not sure where I should be placing this.
Am I nearly there?
http://www.michael-williams.com.au/
Thanks.

Opening specific Spry tabbed panels not working or displaying in IE

I have a tabbed panel spry widget on an asp page in Dreawmweaver (http://www.herbsmithinc.com/casedog.asp) that worked marverously across IE, Firefox and Safari until I tried to get different panels to open on load through links. I used the following tutorial: http://foundationphp.com/tutorials/spry_url_utils.php
Everything works as it should in Firefox and Safari but the panels all appear at once, stacked down the page in IE. Does anyone have a fix for this or see what it is I'm doing wrong?
Thanks!!

I added the code, but It didn't work
I just noticed that there's an error on the page when it loads in IE:
Webpage error details
User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; GTB6.6; .NET CLR 2.0.50727; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729; .NET4.0C; .NET4.0E)
Timestamp: Thu, 24 Mar 2011 15:05:33 UTC
Message: 'Spry.Widget.TabbedPanels' is null or not an object
Line: 292
Char: 1
Code: 0
URI: http://www.herbsmithinc.com/casedog.asp
I searched the error but didn't come up with too much. Any other suggestions? I really appreciate the help!!

Need help linking spry tabbed panel from external page

Could use some help. I need to link to a specific spry tabbed panel on page "A" from a link on page "B" I have tried several "solutions" on the web and had no luck. When I add the code needed at the bottom of the code where you initiate the instance, it stacks the content of ALL panels in the first panel, and renders the tabs inoperable. This is a key feature I need in a new site being developed.

I need to link to a specific spry tabbed panel on page "A" from a link on page "B" I have tried several "solutions" on the web and had no luck.
Have you tried http://foundationphp.com/tutorials/spry_url_utils.php ?
When I add the code needed at the bottom of the code where you initiate the instance, it stacks the content of ALL panels in the first panel, and renders the tabs inoperable.
Depending on what the code looks like, it can do all sorts of things.
Please be reminded that the best way for us to help you is by you supplying a link to your site with a one sentence description of the problem.
Gramps

Link to Spry Tabbed Panels Tab?

Is it possible to link to a specific Spy Tabbed Panels tab from another page?
Thanks.

It is possible to link to a specific tabbed panel from another page, may I suggest you use the following link to visit a post in the spry forum were you will find all the steps needed to do this.
http://forums.adobe.com/thread/48312
Richard

Link to specific accordion tab from other page

Hi all, were working on a site that has recipes page.
there are few recipes and they are all within an accordion widget.
when you click on the title ie: Apple pie the tab opens and shows the info.
My question is : Is it possible to link to that specific accordion tab on the recipes page?
For example: on the apple page there is a link to the apple pie recipe (which is inside an accordion)
is that possible?
yd.

i meant.
if you have a page. and on that page there is an accordion with multiple tab (or panel or whatever they are called)
i would need to make link on another page that link straight to a specific opened tab in the accordion. like an anchor link on another page, but
have the accordion panel open instead.
understand
sorry for the lousy english.
yd.

Internal Links in Spry tabbed Panels

Does anyone know how to create internal links from tabbed
panel to tabbed panel in a Spry tabbed panel asset?
I used a tabbed panel layout for articls on my site, with
each subsection of the article in a different tabbed panel.
I want to put a link at the bottom of each tabbed panel's
content allowing the reader to go to the next tabbed panel's
content.
I know the reader can click on the tabs at the top, but I
want them to be able to click a "next page" button
at the bottom of each tab as well.
When I place a named anchor within the content of a tab's
content and link to it from a word within another tab's content,
the link does not work. I've tried it in Safari, Firefox, and IE.
Doesn't work in any.
If there's a Spry/Ajax expert out there, could you come up
with a work around? Internal links within Spry Tabbed Panels would
be very useful.
An example of using the Spry tabbed panel format for a news
article is here:
http://www.avalonwine.com/Zanzibar-Cellars.php
Thanks for help anyone can offer.
Jean

I am having the exact same problem. I would like to link an
image from my "Home" tab to the top of my "Projects" tab. But the
image link to the Named Anchor at the top of the "Projects" tab
does not work. Named anchors within a tabbed panel work fine. I'm
just not able to cross between tabs. Is there some script we can
add to the link to invoke the Spry tabbed panel widget? thanks,
Jen

Spry tabbing and URL variables

Hi there,
Thanks to these forums I can now link to my lovely Spry tabs.
However, I'm no longer able to pass my page variable by URL and I
was wondering if there was a work-around for this. My basic link is
as follows:
<a href="index.cfm?ID=#ID#"
onclick="TabbedPanels1.showPanel('third'); return
false;">#eventName#</a>
The link is tied to a specific database entry and, when
clicked, should load that entry on the panel. The entry is to
display on the third panel. While the panel links fine, the
database entry isn't called as the variable isn't passed.
Any ideas how I can best this little problem?
Thanks!

Kibbage.TEESO wrote:
The biggest reason I try to not use URL parametersis that URL paramteres open you to SQL injection attacks.
No more then Form variables do. If you think that form variables are somehow magically more secure from injection or any other type of tampering then url variables then you have a very week understanding of Internet technology.
It is no harder for me to modify a form [POST] variable then it for me to modify a url [GET] variable on any request I send to your server. If your server trusts the form variables and does not take precautions; then your application is open to SQL injuection and other hacks.

Setting dynamic Spry tab

Can anyone tell me how to target a specific Spry tab from an
external link?

This is the correct answer - thanks. - searched all day for this
In the head JS tag add the following after
var dsCities = new Spry.Data.XMLDataSet("xml/{dsStates::url}", "state/cities/city");
var statenum = 20; // Sets dsStates to the 21st node value = MA Massachusetts - observer will default the dsCities to massachusetts.xml
// add an array search to return the index for statenum
dsStates.addObserver({ onDataChanged: function(ds, type) { dsStates.setCurrentRowNumber(statenum); } });
There should be a a cookbook on SPRY of popular needed functions - the samples are fragments but it takes a lot of work, the hard way to learn and piece it together..

Linking to a specific spry tab in design view

Similar Messages

Maybe you are looking for