First we had SOAP
and of course there was
Bleach,
but before we can get to COMET we have have to see how
AJAX plays out.
CGI::Ajax
(a.k.a Perljax) is a simple framework for producing AJAX enabled form
applications.
While the Perljax documentation can be a little intimidating, once you get
through it to implementation it's clear the module works as advertised. You
simply
- create a Perljax object with a callback for a subroutine to be invoked
by the client
- call the renderer with your favorite flavor of CGI object and a reference
to the subroutine from your favorite templating system that will return
the contents of the page as a string
And you're off and running. CGI::Ajax handles the server-side request
processing logic and creates the necessary client-side scripts. Of course you
can make it more complicated as need be: call a seperate (external) URI
instead of $self, process multiple inputs and outputs, etc. In particular, if
you'd prefer to not let Perljax auto-inject the JavaScript into your content
you can retrieve the magic bits by calling the show_javascript method.
Finally, there are even live demos of
the sample scripts included with the distribution on the
CGI::Ajax website, please be gentle.
P.S. Takenote that the input and output references for the form
field events refer to the element id and not the name,
this may not be clear from a cursory glance at the documentation.
#!/usr/bin/perl
use CGI::Ajax;
use CGI::Minimal;
my $query = new CGI::Minimal;
my $AJAX = new CGI::Ajax( jsMethod=> \&perlMethod);
print $AJAX->build_html($query, \&createContent);
sub perlMethod{
$_ = shift;
s/for/4/;
s/tw?oo?/2/;
$_ .= ' lol' if rand() > .9;
return uc;
}
sub createContent{
undef $/;
return <DATA>;
}
__DATA__
<html><head>
<body>
This is our simple web page, you could use your favorite templating system
as well, anything that returns a string of HTML.
<p>
<form>
<input id="IN1" type="text" size="12" onKeyUp="jsMethod(['IN1'], ['OUT1'] );">
</form>
<div id="OUT1" style="color:white; background-color:black">
AJAX results show up here, input is AOL echoed.
</div>
</body></html>