Change focus in a Spry Tabbed panel

[soatman]

I have a tabbed panel with three tabs.
email form
client form - default tab
information

Is there a way to change the default tab to the tab that the user clicks on?
Or change the default temporarily.

When the email form is submitted the panel gose back to the default panel
after the form is submitted. I am trying to get the email tab to stay open so
the user can see there confirmation text.

email [email]soatman@comcast.net[/email]

Thanks for any help!

Steve

[danilocelic AdobeCommunityExpert]

soatman wrote:

> I have a tabbed panel with three tabs.
> email form
> client form - default tab
> information
>
> Is there a way to change the default tab to the tab that the user clicks on?
> Or change the default temporarily.

You can set which tab you want to open by using the defaultTab option in the Spry Tabbed panels. Take a look at the code for the first sample on this page as it defaults to the "Tab 3" tab:
[url]http://labs.adobe.com/technologies/spry/samples/tabbedpanels/tabbed_panel_sample.htm[/url]

It creates the tabbed panel with the following code:
var tp1 = new Spry.Widget.TabbedPanels("tp1", { defaultTab: 2 });

For your case, I would suggest using server side code to change the value of the defaultTab, using 0 as the default, and whatever tab number of the one with the server response in it. Remember that Spry uses a 0 based count, as in tab 1 is 0, tab 2 is 1, etc.

FYI: Spry forum is over here:
[url]http://www.adobe.com/cfusion/webforums/forum/categories.cfm?forumid=72&catid=602[/url]



--
Danilo Celic
| [url]http://blog.extensioneering.com/[/url]
| WebAssist Extensioneer
| Adobe Community Expert

[soatman]

Danilo Celic,

Yes thank you. I am able to set the default. my need is.

I have a couple of forms that are in php script the form actions is
server_self validation. These are in two of the tabs. When one is submitted
the tab panel gose back to the default but I need it to stay on the same tab
after the form is submitted and not go to the default tab. Is there a way of
not having a default. So even after the form is submitted it stays in that
tab? Maybe a way of having the default change to which even tab is pressed.

[danilocelic AdobeCommunityExpert]

soatman wrote:

> Danilo Celic,
>
> Yes thank you. I am able to set the default. my need is.
>
> I have a couple of forms that are in php script the form actions is
> server_self validation. These are in two of the tabs. When one is submitted
> the tab panel gose back to the default but I need it to stay on the same tab
> after the form is submitted and not go to the default tab. Is there a way of
> not having a default. So even after the form is submitted it stays in that
> tab? Maybe a way of having the default change to which even tab is pressed.

With the tabbed panels they start off with either the first tab, or a specified tab. For your case you would set the tab to use based upon your server side processing. In PHP for example:

In your sirever side processing:
$tabToShow = 0; // 0 = 1st tab.

// Then perpform whatever processing you want and set the tab to show
// based upon whatever process decisions you want, for example:
if(processingForm()){
$tabToShow = 2; // 2 = 3rd tab
}


Then in the Spry code (probably near the bottom of your page):

var tp1 = new Spry.Widget.TabbedPanels("tp1", { defaultTab: <?php echo($tabToShow);?> });


This will by default start off on tab 0 (1st tab), or any other tab you want, by simply setting $tabToShow to whatever tab you want. Then in your processing script, you can

Or you could add a url parameter to the action of the form within the tab you're working with and use code similar to the last example on this page (you'll have to check the code):
[url]http://labs.adobe.com/technologies/spry/samples/utils/URLUtilsSample.html[/url]

Here's a couple of relevant snippets of JavaScript from that page. The first is from the top of the page, the second from the bottom:
// Grabs the values of the URL parameters for the current URL.
var params = Spry.Utils.getLocationParamsAsObject();

//The defaultTab value checks to see if the url param is defined. If it is not, it sets it to 0.
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1", {defaultTab:(params.panel ? params.panel : 0)});


To do this, you'll have to pull the SpryURLUtils.js file from the download package and link it into your page:
[url]http://labs.adobe.com/technologies/spry/home.html[/url]


I've also seen posted a customized "history" version of the Spry Tabbed panels that saves the panel to display in a cookie, but the page isn't currently available for some reason:
[url]http://www.3rd-eden.com/Spry-it.com/examples/History/tabbedpanels/[/url]

--
Danilo Celic
| [url]http://blog.extensioneering.com/[/url]
| WebAssist Extensioneer
| Adobe Community Expert

[soatman]

Danilo Celic,

I see what you have for the php script, that is what most of this site is done
in.
I will try this out. I will comment back afterwards!

[url]http://so5328.aisites.com/AI_class_IMD312_programming/final_project/index.php[/url]

Thanks alot!

Steve

[Unregistered]

Perfect

var tp1 = new Spry.Widget.TabbedPanels("tp1", { defaultTab: <?php echo($tabToShow);?> });
worked like charm.

have been spending a day to figure it out.
But this worked in 1 second.

Thanks a million
http://www.topworlddirectory.com