Interactive Form Creation/Maintenance

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

Hello all, I've been working on a scheduling system for a client of mine which I will quickly describe: My client will be able to log in to an editor (that's the form this post refers to) and be able to add, delete, or edit appointments. These appointments are stored in an XML file. When one of my client's users comes to the site, they can view a page that dynamically builds a schedule based upon the appointments in the XML file. The part I'm questioning is the editing form.

This will basically be an interactive form. By that, I mean that my client will get this form to appear, then he'll be able to press buttons and type content into the form and then get the same form back but with different information displayed. (If you'd like to see the portion of it I have working now, go here. The username and password are Administrator/schedBuilder - they are case sensitive.)

I've been using HTML::Template for some of the script, such as the login screen, but, as this will be an "interactive" form, I don't see how I can still use HTML::Template. I really need a way to push data into form components and I don't think that can be done with HTML::Template. Perhaps there's a way to use that module that I'm overlooking.

In order to get the functionality that I'm looking for, I've written two different pieces of code that perform the same task, just in different ways. The first one uses various methods from CGI.pm:

#Print the data onto the screen
print 
  table({-border=>1},
    Tr(
      td({-valign=>'top'},
        table({-border=>1},
          Tr(td(center('Days with Appointments:'))),
          Tr(td(center(
            $query->scrolling_list(
              -NAME => "daysList",
              -VALUES => [keys %calendar],
              -SIZE => 5,
              -MULTIPLE => 0,)
              )
            )
          ),
          Tr(td(center(
            $query->submit({-name=>'dateSelectionButton', -value=>'Dis
+play Appts'})
            )
          )
        )
      )
    ),
    td({-valign=>'top'},
      table({-border=>1},
        Tr(td(center('Appointments:'))),
          Tr(td(center(
            $query->scrolling_list(
              -NAME => "apptsList",
              -VALUES => \@apptTimeList,
              -SIZE => 5,
              -MULTIPLE => 0,)
              )
            )
          )
        )
      )                  
    )
  );
[download]

The second piece of code I've written uses block printing and looks like this:

print <<StartTable;
  <TABLE BORDER="1">
    <TR>
      <TD VALIGN="top">
        <TABLE BORDER="1">
          <TR>
            <TD><CENTER>Days with Appointments:</CENTER></TD>
          </TR>
          <TR>
            <TD><CENTER>
StartTable
  print $query->scrolling_list(
    -NAME => "daysList",
    -VALUES => [keys %calendar],
    -SIZE => 5,
    -MULTIPLE => 0,
  );
print <<MidTable;
            </CENTER></TD>
          </TR>
          <TR>
            <TD><CENTER><INPUT TYPE="SUBMIT" VALUE="Display Appts"></C
+ENTER></TD>
          </TR>
        </TABLE>
      </TD>
      <TD VALIGN="top">
        <TABLE BORDER="1">
          <TR>
            <TD><CENTER>Appointments:</CENTER></TD>
          </TR>
          <TR>
            <TD><CENTER>
MidTable
  print $query->scrolling_list(
    -NAME => "apptsList",
    -VALUES => \@apptTimeList,
    -SIZE => 5,
    -MULTIPLE => 0,
  );
print <<EndTable;
            </CENTER></TD>
          </TR>
        </TABLE>
      </TD>
    </TR>
  </TABLE>
   
EndTable
[download]

As far as I can tell, these two bits of code work identically. The only question I have is which one is going to be easier to maintain. Personally, I'm able to read the second bit easier so I would feel that this would be the easiest to maintain, but so often, I hear monks exclaim "USE CGI.pm!" Is there something I'm missing that would make the first portion of code easier to maintain later?

So I'd like to hear your opinions on which chunk of code would be easier to maintain or, if there's an entirely better way of handling this situation, I'd really like to know. One thing that had occured to me is that maybe this is a case of overkill - perhaps using CSS and JavaScript would be an easier way of accomplishing this task.

Thanks,
- Sherlock

Skepticism is the source of knowledge as much as knowledge is the source of skepticism.

Comment on Interactive Form Creation/Maintenance Select or Download Code

Replies are listed 'Best First'.
Re: Interactive Form Creation/Maintenance by Sifmole (Chaplain) on May 09, 2001 at 21:20 UTC
Now that I have seen your link, I can offer this little bit -- I hope it is useful. You can "push" data into Form components using things similar to the following examples: `<INPUT TYPE="TEXT" NAME="FOO" VALUE="<TMPL_VAR NAME="FOOVALUE">"> # Create a Selection list <SELECT NAME="BARLIST"> <TMPL_LOOP NAME="BARLIST"> <OPTION VALUE="<TMPL_VAR NAME="VALUE">"><TMPL_VAR NAME="TEXT_VALUE"> </TMPL_LOOP> </SELECT>` [download] If you need more information regarding building TMPL_LOOP structures the HTML::Template docs show some good examples, but I will include one that would work for the above loop: `$tmpl->param('BARLIST', [ {'VALUE' => '123', 'TEXT_VALUE' => 'First three' }, {'VALUE' => '456', 'TEXT_VALUE' => 'Second three'} ]);` [download]	[reply] [d/l] [select]
Re: Interactive Form Creation/Maintenance by buckaduck (Chaplain) on May 09, 2001 at 21:47 UTC
I often use HTML::Table for this sort of thing. I think it's pretty easy to read and to maintain. Here's an example like yours: use CGI ':standard'; use HTML::Table; # Create the "Days" sub-table my $table = HTML::Table->new; $table1->addRow('Days With Appointments'); $table1->addRow(scrolling_list( -NAME => "daysList", -VALUES => [keys %calendar], -SIZE => 5, -MULTIPLE => 0,)); $table1->addRow(submit({ -name => 'dateSelectionButton', -value => 'Display Appts'})); # Create the "Appointments" sub-table my $table2 = HTML::Table->new; $table2->addRow('Appointments'); $table2->addRow(scrolling_list( -NAME => "apptsList", -VALUES => \@apptTimeList, -SIZE => 5, -MULTIPLE => 0,)); # Create a table to act as a container for # the previous two sub-tables my $bigtable = HTML::Table->new; $bigtable->addRow($table1, $table2); print $bigtable; [download] buckaduck	[reply] [d/l]
Re: Interactive Form Creation/Maintenance by sutch (Curate) on May 09, 2001 at 20:47 UTC
I prefer using templates. HTML::Template is good for simple pages, such as a login screen. But, you need something like Template::Toolkit for applications where you need to embed presentation logic into your templates. This will allow you to dynamically build schedules while divorcing presentation from (business) logic. BTW, the site you mentioned was down when I checked it.	[reply]
Re: Interactive Form Creation/Maintenance by Sherlock (Deacon) on May 10, 2001 at 00:18 UTC
First of all, I'd like to thank everyone for their help on this topic - I think I came out of it with exactly what I was looking for. Using a solution presented by Sifmole, I was able to use HTML::Template to separate my Perl script from my HTML and make a (I believe) much more maintainable script. This is what I ended up with: # editForm.tmpl - The template file I'm now using <HTML> <HEAD> <TITLE>Administrative Schedule Editor</TITLE> </HEAD> <BODY> <FORM method="post" ACTION="http://www.mediaforgeproductions.com/cgi-b +in/SchedBuilder/login.pl"> <TABLE BORDER="1"> <TR> <TD VALIGN="top"> <TABLE BORDER="1"> <TR> <TD><CENTER>Days with Appointments</CENTER></TD> </TR> <TR> <TD> <CENTER> <SELECT NAME="daysList" SIZE="5"> <TMPL_LOOP NAME="daysList"> <OPTION VALUE="<TMPL_VAR NAME="daysListValue">"><TMPL_VA +R NAME="daysListValueText"> </TMPL_LOOP> </SELECT> </CENTER> </TD> </TR> <TR> <TD> <CENTER><INPUT TYPE="SUBMIT" VALUE="Display Appts"></CENTE +R> </TD> </TR> </TABLE> </TD> <TD VALIGN="top"> <TABLE BORDER="1"> <TR> <TD><CENTER>Appointments:</CENTER></TD> </TR> <TR> <TD> <CENTER> <SELECT NAME="apptsList" SIZE="5"> <TMPL_LOOP NAME="apptsList"> <OPTION VALUE="<TMPL_VAR NAME="apptsListValue">"><TMPL +_VAR NAME="apptsListValueText"> </TMPL_LOOP> </SELECT> </CENTER> </TD> </TR> </TABLE> </TD> </TR> </TABLE> </FORM> </BODY> </HTML> # Perl file # # For brevity, I've only included the code # to fill one of the two select boxes. my $template = HTML::Template->new(filename => 'editForm.tmpl'); my @dateList; foreach my $element (keys %calendar) { push @dateList, {'daysListValue' => $element, 'daysListValueText' => + $element}; } $template->param( daysList => \@dateList, apptsList => \@apptTimeList ); print $template->output; [download] I'm sorry that this post has been so long, but I felt that this code could be useful to anyone that might run into a similar issue in the future. Again, thanks for all your help. - Sherlock Skepticism is the source of knowledge as much as knowledge is the source of skepticism.	[reply] [d/l]
Re: Interactive Form Creation/Maintenance by Sifmole (Chaplain) on May 09, 2001 at 20:50 UTC
I was hoping I could help, but I needed a little more clarifcation on what you meant by "interactive". I attempted to go to your --here-- link, but it returned a "Page Not Found" error. Can you fix the link, the .pl or express what you mean by "interactive" a little better? I would love to help you out. I built an entire Hotel Reservation and Room maitanence system using HTML::Template so it is possible to create interactive websites of a certain definition with it. Sincerely, Sifmole UpdateI was writing this at the same time the other poster did. I was not intending to double-jump on the bad link. Sorry. Update On a hunch I decide to play with this link, try this instead, it will take you right in without having to type the Username and Password.	[reply]
Re: Re: Interactive Form Creation/Maintenance by Sherlock (Deacon) on May 09, 2001 at 22:57 UTC
Sorry about the link. I had a lower-case 's' in SchedBuilder and that broke the link. The URL is: http://www.mediaforgeproductions.com/cgi-bin/SchedBuilder/login.pl. Username: Administrator Password: schedBuilder Thanks for the help - I guess I just hadn't thought of using HTML::Template quite the way you showed (in the next post, actually), but that looks like it might do just the trick. Thanks, - Sherlock Update: The link in the original post should now be fixed - thanks to tye. Skepticism is the source of knowledge as much as knowledge is the source of skepticism.	[reply]
Re: Interactive Form Creation/Maintenance by markjugg (Curate) on May 09, 2001 at 23:28 UTC
I use HTML::Template as Sifmole does. Sometimes I also use HTML::FillInForm to make my work even easier. Frequently I'll run a page through HTML::Template and then through HTML::FillInForm. I have some documentation with examples of this here -mark	[reply]
Re: Interactive Form Creation/Maintenance by HamNRye (Monk) on May 10, 2001 at 23:08 UTC
Sherlock... I personally use formats to output HTML. That with a good use of stylesheets can be very powerful. Plus, you can design the HTML in an editor and then make way for vars. A good editor like Homesite can then also make your HTML editable in the same Perl script. Just switch your language preferences. Here is an example: (I alrady had it up...) ############################################################ # Call the format from sub "write_file" # Most HTML attributes defined via Style Sheet. ############################################################ format F = <html> <head> <title>Harris Status</title> <meta http-equiv="REFRESH" content="60; url=harstat.asp"> <link rel="STYLESHEET" type="text/css" href="ichk2.css"> <style> td.fn { color: @<<<<< ; $otxt letter-spacing : @<px; $osp } td.repct { color: @<<<<< ; $repcol } </style> </head> <body background="sandston.gif"> <p align=center>Harris Status as of <%= Now() %> <table width="300" height="100"> <tr> <td bgcolor=@<<<<> $stat{images1} <div align="center" class="sname"> Images 1 <img src=@<<<<<<<<<<<> $light{images1} </div> </td> <td bgcolor=@<<<<> $stat{images3} <div align="center" class="sname"> Images 3 <img src=@<<<<<<<<<<<> $light{images3} </div> </td> </tr> <tr> <td colspan="2"> <div class="rep"> <U>Current Replication Status</U> <table width=290><tr> <td class=server>@<<<<<<<< </td><td class=date>@<<<<<<<< </td><td clas +s=time>@<<<<<<<< </td><td class=repct> @<<<< </td> $images1[0], $images1[1], $images1[2], $images1[3] </tr><tr> <td class=server>@<<<<<<<< </td><td class=date>@<<<<<<<< </td><td clas +s=time>@<<<<<<<< </td><td class=repct> @<<<< </td> $images3[0], $images3[1], $images3[2], $images3[3] </tr></table> </div> <div class=ottl> Files to be Output: <B>@>>></b></div> $fct <div class="out"> <table width=290> ~~ <tr><td class="fn">^>>>>>>>>>>>>>>>>>>>>>>></td></tr> $outpt </table></div> </td></tr> </table> </body> </html> . [download] By using classes and stylesheets, I can change the appearance of my output in a completely separate file. (And in the case of daemons, without stopping and starting for every "new compile".) I also use style declarations in the HTML (cascading baby) to define things that I would like the program to be able to alter. I personally find CGI.pm to be too much of a pain. I think the `$co->h1(->p('EEEK!')); #screw syntax` method of writing this stuff is godawful. Plus, between this and Tk, I get tired of typing "->" and "=>" all the friggin' time. The fact of it is, TMTOWTDI... I think the block printing code will be much easier to maintain. Plus, if you read Saint Larry's thoughts on Perl 6, the syntax for the top example looks to be changing (not soon of course) while the second example looks to have stable syntax. While this is not an immediate issue, do you want to have to learn the OO methods for CGI.pm again when you go to modify this code? (Hmmm, rewrite it in Perl 6 or dig up my old Perl 5 black book and try to figure it out.) Ask this, will you be the only one maintaining the code?? Do you want to be?? If you would like the flexability of allowing users to change the look and feel, using my method with a stylesheet is muy convenient. (On many programs the users have their own stylesheets and can modify the program UI individually.) If not, If you think that maintenance will be done by some other Perl God, and you'd like to keep the uninitiated out of it, use the OO methods to really obfuscate your code. Whatever works for you.	[reply] [d/l] [select]


We don't bite newbies here... much
	PerlMonks