Log in

View Full Version : Form instead text in JavaScript


young_coder
11-15-2010, 06:10 PM
Dear all,
Can anyone help me with this… I do not know if this is possible to be done…
Instead of text:

"Your favorite color is <b>Green</b> right?"

I need to show form like this:


<form action="auto.htm" method="get" >
Your state<br>
<select name="statecode" id="statecode">
<option value="">Choose State...</option>
<option value="AK">Alaska</option>
<option value="AL">Alabama</option>
<option value="AR">Arkansas</option>
</select>
<input type="submit" name="search" value="Get Quotes" />
</form>

Thank you in advance

This is code I wish to modify.


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<style type="text/css">
html,body {
padding:0;
height:100%;
}
#right {
width:500px;
height:100%;
background-color:#999;
text-align:center;
float:right;
}
#left {
height:100%;
margin-right:500px;
background-color:#f00;
text-align:center;
}
</style>
<script type="text/javascript">
function change()
{
switch (document.getElementById("select").value)
{
case "1":
document.getElementById("change").innerHTML = "Your favorite color is <b>Green</b> right?"
break;
case "2":
document.getElementById("change").innerHTML = "Your favorite color is <b>Red</b> right?"
break;
case "3":
document.getElementById("change").innerHTML = "Your favorite color is <b>Yellow</b> right?"
break;
}
}
</script>
</head>
<body>
What is your favorite color
<select onchange="change()" id="select">
<option value="">------</option>
<option value="1">Green</option>
<option value="2">Red</option>
<option value="3">Yellow</option>
</select>
<div id="change" style="margin:10px;width:200px;height:100px;padding:5px;">
Original Text
</div>
</body>
</html>
Beverleyh
11-15-2010, 07:08 PM
Can you please try to be clearer in your requirements please. What are you wanting us to help you with exactly? What do you want to achieve?
young_coder
11-15-2010, 07:17 PM
I'm sorry...
I need, when somebody select option from dropdown menu, I wish to show adequate form, instead to show text "Your favorite color is <b>Green</b> right?". But, when I put <form>, script stops to work. With just text, script working fine.
Beverleyh
11-15-2010, 07:27 PM
We need to see the script in full please and possibly also a current demo page to illustrate what you're describing - at the moment I don't understand where the "green" text aspect comes into play.
young_coder
11-15-2010, 07:40 PM
This is form to be shown for instance for option 1:


<form action="auto.htm" method="get" >
Your state<br>
<select name="statecode" id="statecode">
<option value="">Choose State...</option>
<option value="AK">Alaska</option>
<option value="AL">Alabama</option>
<option value="AR">Arkansas</option>
</select>
<input type="submit" name="search" value="Get Quotes" />
</form>


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script type="text/javascript">
function change()
{
switch (document.getElementById("select").value)
{
case "1":
document.getElementById("change").innerHTML = "This text has to be replaced with form adequate to option 1."
break;
case "2":
document.getElementById("change").innerHTML = "This text has to be replaced with form adequate to option 2."
break;
case "3":
document.getElementById("change").innerHTML = "This text has to be replaced with form adequate to option 3."
break;
}
}
</script>
</head>
<body>
What is your favorite color
<select onchange="change()" id="select">
<option value="">------</option>
<option value="1">option 1</option>
<option value="2">option 2</option>
<option value="3">option 3</option>
</select>
<div id="change" style="margin:10px;width:200px;height:100px;padding:5px;">
This text is shown when option is not selected
</div>
</body>
</html>