Html + JavaScript I need help with using hidden div\'s elements to hide two form
ID: 3529202 • Letter: H
Question
Html + JavaScript
I need help with using hidden div's elements to hide two forms inside of a html webpage. I have all ready created the two forms and the drop down box. The webpage must only loads the drop down box and all forms must hidden with div's elements. The correct form must appear when the user selects the form from the drop down box.
A OnSelect JavaScript must call the correct form. This must all take places on ONE 1.0 STRICT HTML WEBPAGE ONLY. Your submission must meet my requirements and must be error free for credit. Also show were the JavaScript is placed in the web page code.
Thanks
Explanation / Answer
This is the code you want..Check it out.
It is written in HTML 1.0 strict..Even this code can work for any html webpage.
Javascript is written inside the head element.Just copy it and paste your form containt inside the DIV1 and DIV2 and run the web page..It will work..
Code Begin
<?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>DIV HIDE </title>
<script type="text/javascript">
function hide()
{
document.getElementById('div1').style.display = 'none';
document.getElementById('div2').style.display ='none';
}
function show()
{
var a=document.getElementById('select1').value;
if(a=='form1')
{
document.getElementById('div1').style.display='inline';
document.getElementById('div2').style.display='none';
}
else if(a=='form2')
{
document.getElementById('div2').style.display='inline';
document.getElementById('div1').style.display='none';
}
else
{
document.getElementById('div1').style.display = 'none';
document.getElementById('div2').style.display='none';
}
}
</script>
</head>
<body>
<form method="get">
<p>Please Select the form you want to view
<select id="select1">
<option value="">Please select</option>
<option value="form1">
form1
</option>
<option value="form2">
form2
</option>
</select></p>
</form>
<div id="div1">
<form >
<p>This is Form1 Body</p>
</form>
</div>
<div id="div2">
<form>
<p>This is Form2 Body</p>
</form>
</div>
</body>
</html>
Related Questions
drjack9650@gmail.com
Navigate
Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.