Hi,
I have been trying to run an ajax driven tree and it has not been working when I make a cgi script that runs the javascript programm, yet it works fine when I make a regular html file in the Documents folder. Now, here is my code and I am really tired and I have tried everything. All the paths seem to be correct too. I am using an iBook G4 btw and im not pasting all of the css stuff.
I have been trying to run an ajax driven tree and it has not been working when I make a cgi script that runs the javascript programm, yet it works fine when I make a regular html file in the Documents folder. Now, here is my code and I am really tired and I have tried everything. All the paths seem to be correct too. I am using an iBook G4 btw and im not pasting all of the css stuff.
Code:
#! /usr/bin/perl
use strict;
use warnings;
use CGI::Pretty ":standard";
use CGI;
use CGI::Carp qw(fatalsToBrowser);
my $q= new CGI;
$q->header();
print "Content-type:text/html\n\n";
print start_html(-title => 'Arabidopsis Gene Family',
-head => style({type =>'text/css'}, join('',<DATA>), ), );
print <<ENDHTML;
<html>
<head>
<title>Javascript Tree Wizard By Zapatec</title>
<script src="utils/zapatec.js" type="text/javascript"></script>
<script src="zptree/src/tree.js" type="text/javascript"></script>
</head>
<body>
<!-- The HTML for the tree-->
<ul id="designtree">
<li>
Item 1
</li>
<li>
Item 2
<ul>
<li>
SubItem 2.1
</li>
<li>
SubItem 2.2
<ul>
<li>
SubItem 2.2.1
</li>
<li>
SubItem 2.2.2
</li>
</ul>
</li>
<li>
SubItem 2.3
</li>
</ul>
</li>
</ul>
<!-- The Javascript code to initiate the tree-->
<script type="text/javascript">
new Zapatec.Tree("designtree", {
initLevel : 0,
defaultIcons : "customIcon"
});
</script>
<noscript>
<br/>
This page uses a <a href="http://www.zapatec.com/website/main/products/prod2/"> Javascript Tree </a>, but your browser does not support Javascript.
<br/>
Either enable Javascript in your Browser or upgrade to a newer version.
</noscript>
<a href="http://www.zapatec.com/website/main/products/prod3/">Zapatec Javascript Tree</a>
</body>
</html>
ENDHTML
__DATA__
div.scroll-tree {
float:left;
padding-top: .5em;
padding-bottom: .5em;
background-color:#B5B6B5;
}
div.tree-item td.a {
text-decoration:none;
}
.tree {
font: 11px tahoma,verdana,sans-serif;
}
.
.
.