Apply a confirmation alert box with all the users selected data
This is what I have but I seem to be hitting a wall. I have tried and
re-tried different formulas but cant seen to get it. What I am trying to
do is have the user answer the questions then when they hit 'confirm' all
the data entered is relayed back to them as an 'alert'. help. This is what
I have:
<script type="text/javascript">
//<![CDATA[
function storytime()
{
//displays alert
alert("Welcome to an Interactive Story Spot.");
}
function confirm()
{
var spaceship = document.getElementsByName("transport")[0].value;
var ducatti = document.getElementsByName("transport")[1].value;
var ferrari = document.getElementsByName("transport")[2].value;
var jet = document.getElementsByName("transport")[3].value;
var train = document.getElementsByName("transport")[4].value;
var transport = "";
var name ="";
var title ="";
var noun ="";
var num1 ="";
var num2 ="";
var miles = document.getElementsByName("measuretravel")[0].value
var km=document.getElementsByName("measuretravel")[1].value;
var travelmeasure ="";
//determine which mode of transportation was chosen
if (document.getElementsByName("transport")[0].checked)
{
transport = spaceship;
}
else if (document.getElementsByName("transport")[1].checked)
{
transport = ducatti;
}
else if (document.getElementsByName("transport")[2].checked)
{
transport = ferrari;
}
else if (document.getElementsByName("transport")[3].checked)
{
transport = jet;
}
else if (document.getElementsByName("transport")[4].checked)
{
transport = train;
}
//determine which measure of travel was chosen
if (document.getElementsByName("measuretravel")[0].checked)
{
miles = "+num1+" + "+num2+" * 1.60934
measuretravel = miles;
}
else if (document.getElementsByName("measuretravel")[1].checked)
{
km = "+num1+" + "+num2+"
measuretravel = km;
}
//display alert
alert ("Hello, "+name+", your story values are "+title+",
"+noun+", "+tansport+", "+num1+", "+num2+", and
"+measuretravel+" ");
}
//]]>
</script>
</head>
<body onload="runJS()">
<form id="storyform" action="">
<h1>Create Your Own Story</h1>
<p style="font-weight:bold;"> Your Name
<input type="text" name="name" id="name" value="Jane Doe">
</p>
<p style="font-weight:bold;"> Story Title
<input type="text" name="title" id="title" value="Enter Story
Title Here">
</p>
<p style="font-weight:bold;">Choose A Mode Of TRANSPORTATION</p>
<input type="radio" name="transport" id="transport"
value="spaceship" checked="checked"> Spaceship
<br>
<input type="radio" name="transport" id="transort1"
value="ducati"> Ducati
<br>
<input type="radio" name="transport" id="transport2"
value="ferrari"> Ferrari
<br>
<input type="radio" name="transport" id="transport3"
value="jet"> Jet
<br>
<input type="radio" name="transport" id="transport4"
value="train"> Train
<br>
<br>
Enter a NOUN <input type="text" name="noun" id="noun"
value="Paris" onclick=""/>
<br>
Enter a NUMBER <input type="text" name="Num1" id="num1"
value="1" checked="checked" onclick=""/>
<br>
Enter Another NUMBER <input type="text" name="Num2" id="num2"
value="2" onclick=""/>
<p style="font-weight:bold;">Choose a means of MEASURING
TRAVEL</p>
<input type="radio" name="measuretravel" id="measuretravel1"
value="miles"> Miles
<br>
<input type="radio" name="measuretravel" id="measuretravel2"
value="km" checked="checked"> Kilometers
<br>
<br>
<br>
<input type="reset" value="Clear Form">
<input type="button" value="Story Time!" onclick="storytime();">
<input type="button" value="Confirm" onclick= "confirm();">
</form>
</body>
No comments:
Post a Comment