tags:

views:

880

answers:

3

I've tried to google my requirement but without luck. What I have is a form that is broken into several tabs, all which works perfectly. However, now I've been asked to provide an 'All' tab with the whole form, in addition to the individual tabs for each section.

Seems like a fairly straightforward request, but I can't see how I can implement it using the jQuery tabs functionality?

A: 

I'm relatively new to jQuery so there might be a much better approach. But if I had to implement this myself I would look into reparenting the contents of the "tab divs" in the select event of the tab.

Ken Browning
Sounds like it could work. I'm a complete jQuery newbie - so I'm not sure how I'd begin to implement your suggestion?
BrynJ
A: 

I think Ken is on the right trail, but I might just clone the appropriate DOM elements. If there are forms, you're going to probably want a single submit instead of multiple so reparenting isn't ideal.

Cloning them will also keep the height and sizing more consistent if your tabs expand based on the contents.

Maybe look at the following: http://www.evotech.net/blog/2008/11/jquery-tutorial-dom-manipulation-and-sorting/

On the other hand, re-parenting avoids any synchronization issues you might have between each screen.

altCognito
A: 

Rather than having actual tabs, it might be easier for your 'tab' buttons to just hide all form elements that are not part of that 'tab'.

Christopherous 5000