NAME
CGI::Widget::Tabs - Create tab widgets in HTML
SYNOPSIS
use CGI::Widget::Tabs;
my $tab = CGI::Widget::Tabs->new;
use CGI;
my $cgi = CGI->new; # interface to the query params
$tab->headings(@titles); # e.g. qw/Drivers Cars Courses/
$tab->default("Courses"); # the default active tab
$tab->active; # the currently active tab
$tab->class("my_tab"); # the CSS class to use for markup
$tab->cgi_object($cgi); # the object holding the query params
$tab->cgi_param("t"); # the CGI query parameter to use
$tab->wrap(4); # wrap after 4 headings...
$tab->indent(1); # ...and add indentation
$tab->render; # the resulting HTML code
$tab->display; # same as `print $tab->render'
$h = $tab->heading; # new OO heading for this tab
$h->text("TV Listings"); # heading text
$h->key("tv"); # key identifying this heading
$h->raw(1); # switch off HTML encoding
$h->url("whatsontonight.com"); # redirect URL for this heading
$h->class("red"); # this heading has it's own class
# See the EXAMPLE section for a complete example
DESCRIPTION
Introduction
CGI::Widget::Tabs lets you simulate tab widgets in HTML. You could
benefit from a tab widget if you want to serve only one page. Depending
on the tab selected you fetch and display the underlying data. There are
three main reasons for taking this approach:
1. For the end user not to be directed to YAL or YAP (yet another link /
yet another page), but keep it all together: The single point of entry
paradigm.
2. As a consequence the end user deals with a more consistent and
integrated GUI. This will give a better "situational awareness" within
the application.
3. For the Perl hacker to handle multiple related data sources within
the same script environment.
As an example the following tabs could be used on a web page for
someone's spotting hobby:
__________ __________ __________
/ Planes \ / Trains \ / Classics \
------------------------------------------------------
_________
/ Bikes \
------------------------
As you can see, the headings wrap at three and a small indentation is
added to the start of the next row. The nice thing about
CGI::Widget::Tabs is that the tabs know their internal state. So you can
ask a tab for instance which heading has been clicked by the user. This
way you get instant feedback.
"Hey Gorgeous!"
Of course tabs are useless if you can't "see" them. Without proper make
up they print as ordinary text. So you really need to fancy them up with
some eye candy. The designed way is that you provide a CSS style sheet
and have CGI::Widget::Tabs use that. See the class() method for how to
do this.
EXAMPLE
Before digging into the API and all accessor methods, this example will
illustrate how to implement the spotting page from above. So you have
something to start with. It will give you enough clues to get on the
road quickly. The following code is a simple but complete example. Copy
it and run it through the webservers CGI engine. (For a even more
complete and useful demo with multiple tabs, see the file tabs-demo.pl
in the CGI::Widget::Tabs installation directory.) To fully appreciate
it, it would be best to run it in a performance environment, like
mod_perl or SpeedyCGI.
#! /usr/bin/perl -w
use CGI::Widget::Tabs;
use CGI;
print <
EOT
my $cgi = CGI->new;
my $tab = CGI::Widget::Tabs->new;
$tab->cgi_object($cgi);
$tab->headings( qw/Planes Traines Classics Bikes/ );
$tab->wrap(3);
# $tab->wrap(1); # |uncomment to see the effect of
# $tab->indent(0); # |wrapping at 1 without indentation
$tab->default("Traines");
$tab->display;
print "We now should run some intelligent code ";
print "to process ", $tab->active, "";
print "