A
Alex K
Guest
Is it possible to have DIVs within forms in HTML/PHP? What I'd like to do is have a form that a user can fill out in sections; the first section, upon completion, will disappear and the second will appear. Ideally it will all submit at the same time to the same output which I can send to myself via e-mail.
Unfortunately, my code doesn't work! I am able to fill in the first fields, have that section disappear and have the second section open, but then my code freezes and the third DIV doesn't open. Also, it appears not to be submitting (it operates with buttons, and the only 'submit' input is on the third DIV.) Please help - any advice is great!
<script type="text/javascript">
function test1() {
document.getElementById('secondfile').style.display='block';
document.getElementById('firstfile').style.display='none';
}
function test2() {
document.getElementById('thirdfile').style.display='block';
document.getElementById('secondfile').style.display='none';
}
function test3() {
document.getElementById('fourthfile').style.display='block';
document.getElementById('thirdfile').style.display='none';
}
</script>
<form id="testform" name="testform" method="post" action="test.php" enctype="multipart/form-data">
<div id="firstfile" style="display:block">
<p>Name
<input type="text" name="name" />
</p>
<p>Date
<input type="text" name="date" />
</p>
<input name="test" type="button" value="Start" onclick="test1()"/>
</div>
<div id="secondfile" style="display:none;">
<p>Age
<input type="text" name="age" />
</p>
<p>Sex
<input type="text" name="sex" />
</p>
<input name="test2" type="button" value="second" onclick="test2()"/>
</div>
<div id="thirdfile" style="display:none;">
<p>Location
<input type="text" name="location" />
</p>
<p>Annual Income
<input type="text" name="income" />
</p>
<input name="test3" type="submit" value="third" onclick="test3()"/>
</div>
</form>
<div id="fourthfile" style="display:none;">
<?php
$to = "[email protected]";
$name = $_REQUEST['name'];
$date = $_REQUEST['date'];
$age = $_REQUEST['age'];
$sex = $_REQUEST['sex'];
$location = $_REQUEST['location'];
$income = $_REQUEST['income'];
echo "Test";
echo "$date";
echo $age;
echo $sex;
?>
Unfortunately, my code doesn't work! I am able to fill in the first fields, have that section disappear and have the second section open, but then my code freezes and the third DIV doesn't open. Also, it appears not to be submitting (it operates with buttons, and the only 'submit' input is on the third DIV.) Please help - any advice is great!
<script type="text/javascript">
function test1() {
document.getElementById('secondfile').style.display='block';
document.getElementById('firstfile').style.display='none';
}
function test2() {
document.getElementById('thirdfile').style.display='block';
document.getElementById('secondfile').style.display='none';
}
function test3() {
document.getElementById('fourthfile').style.display='block';
document.getElementById('thirdfile').style.display='none';
}
</script>
<form id="testform" name="testform" method="post" action="test.php" enctype="multipart/form-data">
<div id="firstfile" style="display:block">
<p>Name
<input type="text" name="name" />
</p>
<p>Date
<input type="text" name="date" />
</p>
<input name="test" type="button" value="Start" onclick="test1()"/>
</div>
<div id="secondfile" style="display:none;">
<p>Age
<input type="text" name="age" />
</p>
<p>Sex
<input type="text" name="sex" />
</p>
<input name="test2" type="button" value="second" onclick="test2()"/>
</div>
<div id="thirdfile" style="display:none;">
<p>Location
<input type="text" name="location" />
</p>
<p>Annual Income
<input type="text" name="income" />
</p>
<input name="test3" type="submit" value="third" onclick="test3()"/>
</div>
</form>
<div id="fourthfile" style="display:none;">
<?php
$to = "[email protected]";
$name = $_REQUEST['name'];
$date = $_REQUEST['date'];
$age = $_REQUEST['age'];
$sex = $_REQUEST['sex'];
$location = $_REQUEST['location'];
$income = $_REQUEST['income'];
echo "Test";
echo "$date";
echo $age;
echo $sex;
?>