nested forms

[JScriptUser]

Hi!

I want to nest 2 forms that display the textboxes in div inside of a big form that sends the names and values of textboxes to perl script that recognizes the names of the textboxes and sends an e-mail.

My problem is that the *big form* does not enclose &two forms& inside and only the first form textboxes are sent to the perl script.

Is there any way to enclose two more more forms inside of a big form?

Please take a look at this code.


*********************************************
<form name="sub_form" method="POST" action="/cgi-bin/pment/workshops1.pl">
*********************************************
<div id="submission" style="position:absolute;top:150px;left:200px;visibility:hidden;">
<p>Please submit the workshop registration when you are done.</p>
<input type="button" value="prev"
onClick="switchDiv('submission', 'part3');">
<input type="submit" name="Submit" value="Submit">
</div>


<div id="part1" style="position:absolute;top:150px;left:50px;visibility:visible;">

&&&&&&&&&&&&&&&&&&&&&&&&&&&&
<form name="visitor_info">
&&&&&&&&&&&&&&&&&&&&&&&&&&&&
<table>
<tr><td>Your name:</td><td><input name="visname" type="text"></td></tr>
<tr><td>Your phone number:</td>
<td><input name="phone" type="text"></td></tr>
<tr><td>YourZip Code:</td><td><input name="zip" type="text"></td></tr>
</table>
<input type="button" value="next"
onClick="switchIfDone(this.form, 'part1', 'part2');">
&&&&&&&&&&&&&&&&&&&
</form>
&&&&&&&&&&&&&&&&&&&
</div>


<div id="part2" style="position:absolute;top:150px;left:50px;visibility:hidden;">
&&&&&&&&&&&&&&&&&&&&&&&&&&&
<form name="pet_info">
&&&&&&&&&&&&&&&&&&&&&&&&&&&
<table>
<tr><td>Your pet's name:</td>
<td><input name="petname" type="text"></td></tr>

<tr><td>Dog, cat, fish, bird, lizard or other:</td>
<td><input type="text" name="species"></td></tr>

<tr><td>Breed:</td>
<td><input name="breed" type="text"></td></tr>
</table>

<input type="button" value="prev"
onClick="switchDiv('part2', 'part1');">

<input type="button" value="next"
onClick="switchIfDone(this.form, 'part2', 'part3');">
&&&&&&&&&&&&&
</form>
&&&&&&&&&&&&&
</div>

**********
</form>
**********


I'd appreciate your help!