in reply to Re: jquery scripts
in thread jquery scripts

The traditional approach is to move the HTML into a templating system instead of several print statements. This allows you to keep your code separate from the presentation part in the template. Depending on your workflow, this makes it possible for people other than you to change the HTML as it is generated.

For example using Template::Toolkit:

use strict;
use Template;

my $json = '[[1,13],[2,25],[3,17],[4,3],[5,10]]'; # or use JSON.pm

use CGI ':standard'; use CGI::Carp(fatalsToBrowser);
print "Content-type: text/html\n\n";

my $tmpl = Template->new();
$template->process('/home/hermit23/mysite/mytemplate.tt', {
    json => $json,
});

[download]

With the template file /home/hermit23/mysite/mytemplate.tt containing:

<!DOCTYPE html PUBLIC>
<html>
<head>
     <style>
        body { background: #99bbee;}
        #mychart {width:250px;height:300px;background:white;}        
     </style>
     <script src="jquery-1.11.3.min.js"></script>
     <script  src="jquery.flot.min.js"></script>

<script>
var data= [% json %];
var dataset = [{data: data}];
         var options = {series: {lines: { show: true },points: {radius
+: 3,show: true} } };
         $(document).ready(function (){$.plot($("#mychart"), dataset, 
+options);});
</script>
     </head>
<body>
<div id="mychart"></div>
<p><hr><p>
</body>
</html>

[download]

Note the [% json %], which will get replaced verbatim by the value of the json key in the parameters to ->process(...)

In Section Seekers of Perl Wisdom