The Table Module Description

The Table module has been developed to construct tables in Perl programs, which creates HTML table tags to be displayed on the browser. The HTML tags make the Perl programs hard to read. Also by using HTML tags alone, reduces flexibility of components created by using these tags. The table module handles formatting of Tables and generates HTML code for a given table. The only thing that user of this module does to enter value to appropriate cells.

In this documentation we will explain how to use this module starting from very simple one and progressively going to more complex cases. It is best to explain the conventions used in this program in order to interpret the results. Codes and their corresponding results are displayed in a table (yes by using Table module itself). Upper cell of this table contains the code which has black background and text written in yellow. This cell will contain whole program all the time; even the changes are very small. The bottom cell contains the results. To demonstrate Table module we will enter team members of an artifitial project and their relevant data into the $table object and display it. All the methods belong to Table module will be highlighted with blue color in this documentation.

If a user wants to run codes given in a black cells, then this code must be included after some perl statements. In the following table the top cell shows what initial portion of program should contain, the mid cell with green background contains the program you want to run. And bottom cell contain final part of the program.

#!/usr/bin/perl
use OOCGI;
use NTable;
my $query = new CGI;
header;
start_html;
Paste your program here.
end_html;

You should check your program mode, it must be executable.

Let's start with a simple Table. In this example we created a table object without giving any format argument and filled only one cell.

       use NTable; 

       $table = NTable->new;
       $table->insert(0,0,"George");
       display $table;
George

In order to create a Table object we use new method. This method takes a format argument, if there is no argument then default values will be used. In order to insert a value into the table object we have to use insert method. This method takes four arguments, row and column numbers, the value to be inserted and optional format string respectively. The value to be inserted could be a string, number or another object. We will discuss object insertion later in these documentation. We also show you how to use optional format string.

Let's take our sample program one step further and add another cell to it.

       use NTable; 
       $table = NTable->new;
       $table->insert(0,0,"George");
       $table->insert(0,1,"Smith");
       display $table;
George Smith

Now our table object consists of two columns and both of them contain data. As you can see, row and column indices show where the data (or an object) should be inserted. Notice that row and column indices start from zero. Let's add another person in to this table. Second person should be in another row. Therefore for this person we will use row index as 1. Here how we can enter the second person.

       use NTable; 
       $table = NTable->new;
       $table->insert(0,0,"George");
       $table->insert(0,1,"Smith");
       $table->insert(1,0,"Larry");
       $table->insert(1,1,"Wall");
       display $table;
George Smith
Larry Wall

Can we insert values into more than one cell with one statement? Yes, we can do it in many ways. Here is the simple one.

       use NTable; 
       $table = NTable->new;
       $table->insert(0,0,"George");
       $table->insert(0,1,"Smith");
       $table->insert(1,0,"Larry");
       $table->insert(1,1,"Wall");
       $table->insert(2,["Damian","Conway"]);
       display $table;
George Smith
Larry Wall
Damian Conway
Here insert method takes two arguments. The first argument is the index of the row where the values to be inserted. The second argument is an anonymous array that contains values to be inserted. Note that insertion is starting from column 0. There is another method called insert, which does similar thing. This method takes three arguments. The first argument is the index of the row where the values will be inserted. The second argument is the column number where insertion starts. This could be any value including 0. The third argument is an anonymous array that contains values to be inserted. Let's add another person by using this insert method.

       use NTable; 
       $table = NTable->new;
       $table->insert(0,0,"George");
       $table->insert(0,1,"Smith");
       $table->insert(1,0,"Larry");
       $table->insert(1,1,"Wall");
       $table->insert(2,["Damian","Conway"]);
       $table->insert(3,0,["Paul","DuBois"]);
       display $table;
George Smith
Larry Wall
Damian Conway
Paul DuBois

By using insert method this way we can insert more than one value at the middle of the table. These values may be expanding across one or more columns.

We entered enough people to our table, before inserting more people into the table lets do some formatting. How can we format a table? Here is one way, we will show the other ways later.

       use NTable; 
       $table = NTable->new;
       $table->insert(0,0,"George");
       $table->insert(0,1,"Smith");
       $table->insert(1,0,"Larry");
       $table->insert(1,1,"Wall");
       $table->insert(2,["Damian","Conway"]);
       $table->insert(3,0,["Paul","DuBois"]);
       $table->table_format("border=3 CELLPADDING='5' align=center");
       display $table;
George Smith
Larry Wall
Damian Conway
Paul DuBois

Here table_format method describes how table should be formatted. This formatting effects a table as a whole.

We can also add headers to our table, here how we can do that.

       use NTable; 
       $table = NTable->new;
       $table->insert(0,0,"George");
       $table->insert(0,1,"Smith");
       $table->insert(1,0,"Larry");
       $table->insert(1,1,"Wall");
       $table->insert(2,["Damian","Conway"]);
       $table->insert(3,0,["Paul","DuBois"]);
       $table->table_format("border=3 CELLPADDING='5' align=center");
       $table->headers(["First Name","Last Name"]); 
       display $table;
First Name Last Name
George Smith
Larry Wall
Damian Conway
Paul DuBois

To put a header to our table we used headers method. This method takes an anonymous array as an argument, which contains headers. As you can see from displayed table, it is hard to distinguish content of the table from headers. We should use different background for the headers. This can be accomplished by using head_format method. Here how it is done.

       use NTable; 
       $table = NTable->new;
       $table->insert(0,0,"George");
       $table->insert(0,1,"Smith");
       $table->insert(1,0,"Larry");
       $table->insert(1,1,"Wall");
       $table->insert(2,["Damian","Conway"]);
       $table->insert(3,0,["Paul","DuBois"]);
       $table->table_format("border=3 CELLPADDING=5 align=center");
       $table->headers(["First Name","Last Name"]); 
       $table->head_format("style='background-color: #CDCDCD;'"); 
       display $table;
First Name Last Name
George Smith
Larry Wall
Damian Conway
Paul DuBois

By using different background color for headers, table becomes more appealing to the eye. Can we also change formats of individual cells? Yes, we can do that. Let assume that we want to put different background color for our manager's name. Here how can we do that?

       use NTable; 
       $table = NTable->new;
       $table->insert(0,0,"George","id=lightblue");
       $table->insert(0,1,"Smith","id=yellow");
       $table->insert(1,0,"Larry");
       $table->insert(1,1,"Wall");
       $table->insert(2,["Damian","Conway"]);
       $table->insert(3,0,["Paul","DuBois"]);
       $table->table_format("border=3 CELLPADDING=5 align=center");
       $table->head_format("id=head"); 
       $table->headers(["First Name","Last Name"]); 
       display $table;
First Name Last Name
George Smith
Larry Wall
Damian Conway
Paul DuBois

Here we used optional fourth argument to insert method to format a cell. By using this argument we can set many attributes of a cell. To show how to use different tag's we deviate from our original example for the time being. Each cells of following table is formatted differently to show how to use tags.

       use NTable; 
       $table = NTable->new;
       $table->insert(0,0,"George","style='background-color:lightblue; text-align: right;
                          font-size: 1.5em; color:white; font-weight: bold;'");
       $table->insert(0,1,"Smith","style='background-color: black; color: yellow; font-size: 0.75em;'");
       $table->insert(1,0,"Larry","id=redwhite  style='font-size: 1.75em;'");
       $table->insert(1,1,"Wall", "style='font-variant: small-caps'");
       $table->insert(2,0,"Damian","id=yellow style='letter-spacing: 4px; font-size: 1.25em;'");
       $table->insert(2,1,"Conway","d=gold style='vertical-align: text-top;'");
       $table->insert(3,0,"Paul","id=gold");
       $table->insert(3,1,"DuBois","style='text-transform: uppercase'");
       $table->insert(4,0,"Paul DuBois","colspan=2 style='color: blue; font-weight: bold; text-align: center;'");
       $table->insert(5,0,"John Smith","rowspan=2 style='color:red;'");
       $table->insert(5,1,"AAA","id=yellow");
       $table->insert(6,1,"BBB","style='background-color:green; color:white;'");
       $table->table_format("border=3 CELLPADDING=5 align=center");
       $table->head_format("id=head"); 
       $table->headers(["First Name","Last Name"]); 
       display $table;
First Name Last Name
George Smith
Larry Wall
Damian Conway
Paul DuBois
Paul DuBois
John Smith AAA
BBB

As you can see from this example format elements contains key value pairs separated from each other with ";". The key value separator is an ":" character. Note that "DuBois" is written in italic, however we do not have any format for that. Also notice that "DuBois" is shown in italic in code section. This is because normal italic tags are put around "DuBois". If you can not find a format tag supported by Table module, you can use usual HTML tags.

Here are the tags supported by Table insert method and values they get

        TAG      DESCRIPTION               VALUES
        color    Font Color                blue,green,... #CDCDCD,#FFF000,...
        bgcolor  Background color          blue,green,... #CDCDCD,#FFF000,...
        size     Font Size                 1,2,3,...      -1,-2,-3,...
        bold     If font is bold           "yes"
        align    Horizontal alignment      "left","center","right"
        valign   Vertical alignment        "top", "center","buttom"
        rowspan  Horizontal cell expansion 2,3,... 
        colspan  Vertical   cell expansion 2,3,..
        face     Font face                 "arial",...
        width
        

In practice sometime table columns all have same format. To write cell formats to individual cell is a waste of time. To overcome this we have ways to format columns. Let's go back our original table and change format of each column and keep manager's format intact. In order to do that we will use column_formats method.

       use NTable; 
       $table = NTable->new;
       $table->insert(0,0,"George","id=lightblue");
       $table->insert(0,1,"Smith","id=lightblue");
       $table->insert(1,0,"Larry");
       $table->insert(1,1,"Wall");
       $table->insert(2,["Damian","Conway"]);
       $table->insert(3,0,["Paul","DuBois"]);
       $table->table_format("border=3 CELLPADDING=5 align=center");
       $table->head_format("id=head"); 
       $table->headers(["First Name","Last Name"]); 
       $table->column_formats(["id=yellow","id=lightblue"]);
       display $table;
First Name Last Name
George Smith
Larry Wall
Damian Conway
Paul DuBois

As you can see the column_formats method takes an anonymous array as an argument. This array contains formats of each column starting from zero. If a column format is missing, you should enter "" for that column. This will be shown in next example.

Now lets enter George's telophone number to third column (column index 2) and Paul's room number to fourth column (column index 3)

       use NTable; 
       $table = NTable->new;
       $table->insert(0,0,"George","id=lightblue");
       $table->insert(0,1,"Smith","id=lightblue");
       $table->insert(0,2,"111-222-3333");
       $table->insert(1,0,"Larry");
       $table->insert(1,1,"Wall");
       $table->insert(2,["Damian","Conway"]);
       $table->insert(3,0,["Paul","DuBois"]);
       $table->insert(3,3,"B303");
       $table->table_format("border=3 CELLPADDING=5 align=center");
       $table->head_format("id=head"); 
       $table->headers(["First Name","Last Name"]);
       $table->column_formats(["id=yellow", "id=redwhite", "", "id=pink"]);
       display $table;
First Name Last Name
George Smith 111-222-3333
Larry Wall
Damian Conway
Paul DuBois B303

We can notice followings in this table. First it adjusted its size automatically. Second it changed background color for forth column (index 3), however did not change background for third column (index 2) as specified with column_formats method.

There is a small problem in this table. It adjusted table size correctly, except that it does not know what to do with headers of these new columns. Object needs our help in this point. We have to specify these headers. Let's add Phone and Room headers.

       use NTable; 
       $table = NTable->new;
       $table->insert(0,0,"George","id=lightblue");
       $table->insert(0,1,"Smith","id=lightblue");
       $table->insert(0,2,"111-222-3333");
       $table->insert(1,0,"Larry");
       $table->insert(1,1,"Wall");
       $table->insert(2,["Damian","Conway"]);
       $table->insert(3,0,["Paul","DuBois"]);
       $table->insert(3,3,"B303");
       $table->table_format("border=3 CELLPADDING=5 align=center");
       $table->head_format("id=head"); 
       $table->headers(["First Name","Last Name","Phone","Room"]);
       $table->column_formats(["id=yellow", "id=redwhite", "", "id=pink"]);
       display $table;
First Name Last Name Phone Room
George Smith 111-222-3333
Larry Wall
Damian Conway
Paul DuBois B303

When we created table object we did not use any arguments in order create the object. We can give a format as an argument to the constructor of the table. Instead of specifying all the formats needed for a table by using special methods, we can set a format variable ( an anonymous hash ) and use this to construct an object. Now lets set a format argument and create a table object by using this format. We will create the same table by using this approach. Here how we can do it.

       use NTable;
       $format = {
          table_format   => "border=3 CELLPADDING=5 align=center",
          head_format    => "id=head",
          headers        => ["First Name","Last Name","Phone","Room"],
          column_formats => ["id=yellow",
                             "id=pink",
                             "",
                             "id=lightblue"]
       };
       $table = NTable->new($format);
       $table->insert(0,["George","Smith","111-444-3333"]);
       $table->insert(1,["Larry","Wall"]);
       $table->insert(2,["Damian","Conway"]);
       $table->insert(3,["Paul","DuBois","","B303"]);
       $table->cell_format(0,0,["id=lightblue","id=lightblue"]);
# following two lines will do same thing 
#       $table->cell_format(0,0,"bgcolor:blue");
#       $table->cell_format(0,1,"bgcolor:blue");
       display $table;
First Name Last Name Phone Room
George Smith 111-444-3333
Larry Wall
Damian Conway
Paul DuBois B303

You should note followings. We set column formats, however for George's name we want to use different background color. To do that we need cell_format method. If a string is given as an argument to this function, it will use that string to format the specified cell. However if an anonymous array is given, it will use that array to format cells starting from the specified cell and move to the next column and format that cell. This will continue as long as there is a format strings in the array, or number of column reaches to its limit.

After inserting necessary fields to our table we realized that last name column should come before first name and there is no need for column containing phone number. If the amount of data entered is not too much we can edit our program and rearrange the fields. However amount of the data entered is too much, then this is not an option. There must be a better way. To do that we will use print_columns method or corresponding format statement. We will use this method before displaying the table. Here how it's being done.

       use NTable;
       $format = {
          table_format   => "border=3 CELLPADDING=5 align=center",
          head_format    => "id=head",
#         print_columns  => [1,0,3],
          headers        => ["First Name","Last Name","Phone","Room"],
          column_formats => ["id=yellow", "id=redwhite", "", "id=pink"]
       };
       $table = NTable->new($format);
       $table->insert(0,["George","Smith","111-222-3333"]);
       $table->insert(1,["Larry","Wall"]);
       $table->insert(2,["Damian","Conway"]);
       $table->insert(3,["Paul","DuBois","","B303"]);
       $table->cell_format(0,0,["id=gold","id=blue",
                                "id=red","id=lightblue"]);
       $table->print_columns([1,0,3]); 
       display $table;
Last Name First Name Room
Smith George
Wall Larry
Conway Damian
DuBois Paul B303

As you can see print_columns method allow us to display columns in any order and in any number we want. More advanced methods and how to use them will be explained in next section. Let's put the entire team member in a table as a final example.

       use NTable;
       $format = {
          table_format   => "border=3 CELLPADDING=5 align=center",
          head_format    => "id=head",
          headers        => ["First Name","Last Name","Phone","Room"],
          column_formats => ["id=yellow", "id=gold", "id=yellow", "id=gold"]
       };
       $table = NTable->new($format);
       $table->insert( 0,["George",   "Smith",        "222-0640","B301"]);
       $table->insert( 1,["Larry",  "Wall",      "222-0505","B305"]);
       $table->insert( 2,["Damian", "Conway",            "222-0506","B306"]);
       $table->insert( 3,["Ganesh",  "Kalanadhabhatla","222-0503","B307"]);
       $table->insert( 4,["Sriram",  "Gopalan",        "222-????","B3XX"]);
       $table->insert( 5,["Xiaoping","Gu",             "222-0509","B305"]);
       $table->insert( 6,["John",    "Jeyasekeran",    "222-0503","B136"]);
       $table->insert( 7,["Bulent",  "Kivanc",         "222-0504","B304"]);
       $table->insert( 8,["Su-Che",  "Liao",           "222-0508","B312"]);
       $table->insert( 9,["Jane",    "Sun",            "222-0541","B312"]);
       $table->insert(10,["James",   "Lee",            "222-????","B3XX"]);
       $table->insert(11,["Lutfu",   "Batakci",        "222-????","B3XX"]);
       $table->insert(12,["Paul",  "DuBois",          "222-0535","B303"]);
       $table->cell_format(0,0,["id=lightblue","id=lightblue",
                                "id=lightblue","id=lightblue"]);
       $table->sort([0]);
       display $table;
First Name Last Name Phone Room
Bulent Kivanc 222-0504 B304
Damian Conway 222-0506 B306
Ganesh Kalanadhabhatla 222-0503 B307
George Smith 222-0640 B301
James Lee 222-???? B3XX
Jane Sun 222-0541 B312
John Jeyasekeran 222-0503 B136
Larry Wall 222-0505 B305
Lutfu Batakci 222-???? B3XX
Paul DuBois 222-0535 B303
Sriram Gopalan 222-???? B3XX
Su-Che Liao 222-0508 B312
Xiaoping Gu 222-0509 B305

As you can see from previous programs that insert function is very versetile. Actually you can use insert function in 13 different forms. This forms are given below. Note that R is integer index for row, C is integer index for column. $val is a single value to be inserted, @val is for a range of values to be inserted, $fmt is format valid for all values being inserted. And finally @fmt is format range for corresponding values of @val range.

        1  insert(R, C,  $val);
        2  insert(R, C,  $val,   $fmt);
        3  insert(R, C, [@val]);
        4  insert(R, C, [@val],  $fmt);
        5  insert(R, C, [@val], [@fmt]);
        6  insert(R,    [@val]);
        7  insert(R,    [@val],  $fmt);
        8  insert(R,    [@val], [@fmt]);
        9  insert(      [@val]);
       10  insert(      [@val],  $fmt);
       11  insert(      [@val], [@fmt]);
       12  insert(       $val);           requires insert("\n") or
                                          $obj->nextrow for Row end
       13  insert(       $val,   $fmt);   requires insert("\n") or
                                          $obj->nextrow for Row end
       
       use NTable;
       $format = "border=3 CELLPADDING=5 align=center";

       my $fmt = "id=lightpink";
       my @fmt = ("id=redwhite",
                  "id=gold","id=lightyellow",
                  "id=pink","id=lightblue",
                  "id=red");
       my @val = qw(Aaa Bbb Ccc Ddd);

       $table = NTable->new($format);
       # Row 0 uses insert defined in form 1
       $table->insert(0,0,1);
       $table->insert(0,1,"Aaa");
       $table->insert(0,2,"Bbb");
       $table->insert(0,3,"Ccc");
       $table->insert(0,4,"Ddd");
       $table->insert(0,5,"No Format");
       # Row 1 uses insert defined in form 2
       $table->insert(1,0,2,    $fmt);
       $table->insert(1,1,"Aaa",$fmt);
       $table->insert(1,2,"Bbb",$fmt);
       $table->insert(1,3,"Ccc",$fmt);
       $table->insert(1,4,"Ddd",$fmt);
       $table->insert(1,5,"Global Format",$fmt);
       # Row 2 uses insert defined in form 3
       $table->insert(2,0,[3,@val,"No Format"]);
       # Row 3 uses insert defined in form 4
       $table->insert(3,0,[4,@val,"Global Format"],$fmt);
       # Row 4 uses insert defined in form 5
       $table->insert(4,0,[5,@val,"Individual Format"],[@fmt]);
       # Row 5 uses insert defined in form 6
       $table->insert(5,[6,@val,"No Format"]);
       # Row 6 uses insert defined in form 7
       $table->insert(6,[7,@val,"Global Format"],$fmt);
       # Row 7 uses insert defined in form 8
       $table->insert(7,[8,@val,"Individual Format"],[@fmt]);
       # Row 8 uses insert defined in form 9
       $table->insert([9,@val,"No Format"]);
       # Row 9 uses insert defined in form 10
       $table->insert([10,@val,"Global Format"],$fmt);
       # Row 10 uses insert defined in form 11
       $table->insert([11,@val,"Individual Format"],[@fmt]);
       # Row 11 uses insert defined in form 12
       $table->insert(12);
       $table->insert("Aaa");
       $table->insert("Bbb");
       $table->insert("Ccc");
       $table->insert("Ccc");
       $table->insert("No Format");
       $table->nextrow;
       # Row 12 uses insert defined in form 13
       $table->insert(13,$fmt);
       $table->insert("Aaa",$fmt);
       $table->insert("Bbb",$fmt);
       $table->insert("Ccc",$fmt);
       $table->insert("Ccc",$fmt);
       $table->insert("Global Format",$fmt);
       $table->insert("\n");
       $table->insert("Note that newline character in previous insert",
                      "colspan=6 id=yellow align=center")
       display $table;
1 Aaa Bbb Ccc Ddd No Format
2 Aaa Bbb Ccc Ddd Global Format
3 Aaa Bbb Ccc Ddd No Format
4 Aaa Bbb Ccc Ddd Global Format
5 Aaa Bbb Ccc Ddd Individual Format
6 Aaa Bbb Ccc Ddd No Format
7 Aaa Bbb Ccc Ddd Global Format
8 Aaa Bbb Ccc Ddd Individual Format
9 Aaa Bbb Ccc Ddd No Format
10 Aaa Bbb Ccc Ddd Global Format
11 Aaa Bbb Ccc Ddd Individual Format
12 Aaa Bbb Ccc Ccc No Format
13 Aaa Bbb Ccc Ccc Global Format
Note that newline character in previous insert

As you can see from previous program we have wide selection for the insert method. This gives us tremendous flexibility during table creation. We should emphasize that the $fmt values are given as string or a number in previous program. However you can put any object which has a print method into any cell of the table object. This print method should print valid tags that you want to insert into a cell. Since Table and FormElements objects have these properties, you can put tables into another table, or any FormElements into a table.

Go To Documents