Need help to guide how to create client sort table

GordonLim has asked for the wisdom of the Perl Monks concerning the following question:

Hi All, Is anyone know how to make the Perl table have a sort filter like a Microsoft Excel? Maybe need to install any extra library? Below is my perl script show out the standard table in the broswer:

open(INFO, "data.txt"); # Open db for reading
@array=<INFO>;
close (INFO);
@ascend=sort(@array);

print $status_table->header('text/html');    # create the HTTP header
print $status_table->start_html('Status Table');    # start the HTML
print $status_table->h1({-border=>'0',  -align=>'center'},'Welcome to 
+Engineering Equipment List');
print $status_table->start_table({-border=>'5',-align=>'center'});
print $status_table->start_Tr({-align=>'center', -style=>'background-c
+olor: #00BFFF'});
print $status_table->start_td;
print 'No';
print $status_table->start_td;
print 'Equipment ID';
print $status_table->start_td;
print 'Description';
print $status_table->start_td;
print 'Serial Number';
print $status_table->start_td;
print 'Asset Tag';
print $status_table->start_td;
print 'MIDA';
print $status_table->start_td;
print 'Old MIDA Ref';
print $status_table->start_td;
print 'Group';
print $status_table->start_td;
print 'Owner';
print $status_table->start_td;
print 'Location';
print $status_table->start_td;
print 'Location Comment';
print $status_table->start_td;
print 'Comment';
print $status_table->start_td;
print 'Cost Center';
print $status_table->start_td;
print 'Tagging Date';
print $status_table->end_td;
print $status_table->end_Tr;

foreach my $line (@ascend)
{
    my($Equipment_ID,$Description,$Serial_Number,$Asset_Tag,$MIDA,$Old
+_MIDA_Ref,$Group,$Owner,$Location,$Location_Comment,$Comment,$Cost_Ce
+nter,$Tagging_Date)=split(/\|/,$line);
    print $status_table->start_form(-name=>'Detail', -target=>'_top', 
+-method=>'post', -action=>'detail.pl');
    print $status_table->start_Tr;
    print $status_table->start_td({-align=>'center'});
    print $i++;
    print $status_table->start_td({-align=>'center'});
    print "$Equipment_ID";
    print $status_table->start_td;
    print "$Description";
    print $status_table->start_td({-align=>'center'});
    print "$Serial_Number";
    print $status_table->start_td({-align=>'center'});
    print "$Asset_Tag";
    print $status_table->start_td({-align=>'center'});
    print "$MIDA";
    print $status_table->start_td({-align=>'center'});
    print "$Old_MIDA_Ref";
    print $status_table->start_td({-align=>'center'});
    print "$Group";
    print $status_table->start_td({-align=>'center'});
    print "$Owner";
    print $status_table->start_td;
    print "$Location";
    print $status_table->start_td;
    print "$Location_Comment";
    print $status_table->start_td;
    print "$Comment";
    print $status_table->start_td({-align=>'center'});
    print "$Cost_Center";
    print $status_table->start_td({-align=>'center'});
    print "$Tagging_Date";
    print $status_table->end_td;
    print $status_table->end_Tr;   
    print $status_table->end_form;
}
print $status_table->end_table;    #end the table
print $status_table->end_html;    # end the HTML
[download]

Thanks

Comment on Need help to guide how to create client sort table Download Code

Replies are listed 'Best First'.
Re: Need help to guide how to create client sort table by Anonymous Monk on Jun 24, 2013 at 02:51 UTC
simple search for now, I'll be back with code `[html table sort] [html sort table] [cpan://html table sort] [metacpan://html table sort] [cpan://jquery html table sort]` html table sort html sort table html table sort html table sort jquery html table sort jquery html table sort JQuery::TableSorter - The JQuery TableSorter	[reply] [d/l]
Re: Need help to guide how to create client sort table by DrHyde (Prior) on Jun 25, 2013 at 10:38 UTC
You need Javascript. I recommend this library.	[reply]
Re^2: Need help to guide how to create client sort table by GordonLim (Acolyte) on Jun 26, 2013 at 07:44 UTC
Thanks DrHyde, this link is very useful for me. :)	[reply]
Re: Need help to guide how to create client sort table ( mojo.template.array.autoindex.sortable.pl ) by Anonymous Monk on Jun 25, 2013 at 01:28 UTC
And here it is, if JQuery::TableSorter were added I'd look for (jquery/css) ways to disable the uparrow/downarrow links if user has javascript on, so the browser does the work, not perl I run this as `perl mojo.template.array.autoindex.sortable.pl daemon --listen http://localhost:80/` The some variable names are dumb :) The subs then mojo stuff before __DATA__ order is intentional, see Mojolicious::Lite #!/usr/bin/perl -- # Automatically enables "strict", "warnings", "utf8" and Perl 5.10 fea +tures use Mojolicious::Lite; sub my_sorted_fudge { ## has no pageination :P my( $sortorder, $sortindex ) = @_; $sortorder \|\|= ''; #~ $sortindex \|\|= 0; $sortindex = int $sortindex ; my %order = ( 'ascend' => sub { $$a[ $sortindex ] cmp $$b[ $sortindex ] }, 'descend' => sub { $$b[ $sortindex ] cmp $$a[ $sortindex ] }, '' => undef, # default sort order, none ); my $byorder = $order{ $sortorder }; my @th = ( "Ro", "Sham", "Bo" ); my @array = ( ["i", "f", "i"], ["q", "s", "n"], ["u", "g", "m"], ["j", "r", "n"], ["w", "r", "j"], ["q", "q", "n"], ["x", "p", "p"], ["o", "h", "b"], ["g", "x", "a"], ); $byorder and @array = sort $byorder @array; ## don't sort by defau +lt return \@array, \@th ; } sub mojo_index { my $self = shift; my $sortorder = $self->param('sortorder') \|\| ''; my $sortindex = $self->param('sortindex') \|\| 0; my( $rah, $rahth ) = my_sorted_fudge( $sortorder, $sortindex ); return $self->render( ray => $rah, rayth => $rahth, sortindex => $sortindex, sortorder => $sortorder, title => 'the sortening', ); } ## .ep templates are auto_escape <%= by default / XML escaped result get '/' => \&mojo_index => 'index';;; app->start; [download] __DATA__ @@ index.html.ep % layout 'green'; %= content content => begin <table border="1"> <thead> <tr> % for my $thix ( 0 .. $#$rayth ){ <th> <%# uparrow =%> <a href="/?sortorder=ascend;sortindex=<%= $thix %> +">↑</a> <%= $$rayth[$thix] =%> <%# downarrow =%> <a href="/?sortorder=descend;sortindex=<%= $thix % +>">↓</a> </th> % } </tr> </thead> <tbody> % for my $rai ( @$ray ) { <tr> % for my $cel ( @$rai ){ <td> <%= $cel =%> </td> % } </tr> % } </tbody> </table> % if( $sortorder and defined $sortindex ){ <div id="sortorderdesc"> * sortorder( <%= $sortorder %>) by sortindex( <%= $sortindex %> aka <%= $$rayth[ $sortindex ] %> ) </div> % } % end @@ layouts/green.html.ep <html> <head> <title><%== title %></title> </head> <body bgcolor="lightgreen"> <%= content %> </body> </html> [download]	[reply] [d/l] [select]
Re^2: Need help to guide how to create client sort table ( mojo.template.array.autoindex.sortable.pl ) by GordonLim (Acolyte) on Jun 26, 2013 at 07:43 UTC
Thanks Anonymous Monk for provided me such long code. I will try this in next week due to some reason cannot install Mojolicious::Lite by this week. :)	[reply]


Clear questions and runnable code get the best and fastest answer
	PerlMonks