|
JavaScript - Radio Value
Hi,
Been trying to figure this code out for some hours now to no avail. I have 2 radio buttons on the page and would like to get the value from the selected button so I can use it for another function. Code: var alpineResort=document.SkiR.Type.checked=true;
var alpineResort=parseFloat(alpineResort)
if ( ( document.SkiR.Type[0].checked == false )
&& ( document.SkiR.Type[1].checked == false ) )
{
alert ( "You have no selected any value." );
valid = false;
document.SkiR.Type.focus()
}
I managed to validate it, but puzzled as to how to get the value out of it. Really need some help as its quite urgent! thanks Similar TutorialsI have 4 rows in a table. Each row consist of 4 radio buttons. Each radio button per row has different values in it but has the same name (group) ex: <input type="radio" name="a" value="1"> <input type="radio" name="a" value="2"> <input type="radio" name="a" value="3"> <input type="radio" name="a" value="4"> <input type="radio" name="b" value="1"> <input type="radio" name="b" value="2"> <input type="radio" name="b" value="3"> <input type="radio" name="b" value="4"> and so on.. If I click radio button A with value 2, I want to output the total at the bottom as "2".. Also, if I click radio button B with value 3, I want to output the total of A and B as 5 and so on.. How can I automatically calculate the answer based on which radio button was click? update: I got my answer from this site: http://stackoverflow.com/questions/1...s-using-jquery All, I have the following code: Code: <form action="" name="myform" method="post">
<input type="hidden" id="picimages" name="picimages" value="<?php echo $resultsetstory['bigger_id']; ?>" />
<p>
<label>
<input type="radio" id="picimages" name="picimages" value="<?php echo $resultsetstory['picture_id']; ?>" />
<?php
if($resultsetstory['title']<>""){
echo $resultsetstory['title'];
}else{
echo "Image 1";
}
?>
</label>
<br />
<label>
<input type="radio" id="picimages" name="picimages" value="<?php echo $resultsetpic2['picture_id']; ?>" />
<?php
if($resultsetpic2['title']<>""){
echo $resultsetpic2['title'];
}else{
echo "Image 2";
}
?>
</label>
<br />
<input name="submit" type="button" value="Vote!" onclick="javascript:voteupdate(this.myform);"/>
</p>
</form>
When I submit this, it goes to this function: Code: function voteupdate(obj) {
var poststr = "picimage=" + document.getElementById("picimage").value +
"&bigger_id=" + encodeURI( document.getElementById("bigger_id").value );
alert(poststr);
makePOSTRequest('voteresults.php', poststr);
}
However I can't get the value of the radio group for the one that is selected. Can someone see what is wrong? Thanks. All: I need some help with a radio button code. It seems simple but I am really new at JavaScript so I need help. I have created a JavaScript code that has three radio buttons (High, Medium, and Low). When you click on high two text boxes appear so that an email address can be added. What I need help with is making the text boxes disappear if someone accidentally click high and then went back to low or medium. Currently the High button stays clicked and the text boxes still show. Any help would be great. Thanks, Stephen Code: <script type="text/javascript">
function showHide(el){
obj = document.getElementById(el).style;
(obj.display == 'none')? obj.display = 'block' : obj.display = 'none';
}
</script>
<form id="form1" name="form1" method="post" action="">
<label>
<input type="Checkbox" name="High" value="High" onclick="showHide('group1')" /> High
</label>
<label>
<input type="Checkbox" name="Medium" value="Button" /> Mediun
</label>
<label>
<input type="Checkbox" name="Medium" value="Button" /> Low
</label>
<p id="group1" style="display: none;">
<label>
<b>friend1  </b><input type="Text" name="textGroup1" value="@gmail.com" /> <br/>
</label>
<br />
<label>
<b>friend2  </b><input type="text" name="textGroup1" value="@gmail.com" />
</label>
</p>
</form>
Im trying to configuere a form that a. a radio buttons that allow the user to choose between quarters, nickels, dimes and pennies. and show image when click on my radio button im confused on how to get the image to display whenthey click on the radio button I'm creating a unit converter program using radio buttons and i can't seem to get one aspect working. i can't seem to get another set of radio buttons to display. the way the program is supposed to work is there will be 3 radio buttons saying to convert length, weight, and volume. if the user selects to convert weight, another set of radio buttons will appear with 2 options, to convert from pounds to kilograms, or kilograms to pounds. then the user enters the number in a text box and clicks to convert button. my problem is getting the second set of radio buttons to display. I have no clue how to get this to work. to get a better understanding of whats going on, here is the program without the radio buttons that i created. i'm trying to use radio buttons in place of the prompting message. Code:
<!DOCTYPE html>
<html>
<head>
<title> Conversions of Weight and Length</title>
<script type="text/javascript">
function clearMe()
{
var _s=top;
var _d=_s.document;
_d.open();
_d.write("");
_d.close();
}
function main()
{
var repeat = confirm("Do you want to perform another conversion ? \r" + "<p><b>Note:</b> Pressing OK allows for another conversion, and pressing CANCEL exits</p>");
if(repeat==true)
{
convert();
}
else
{
alert("Your program has been terminated!");
self.close();
}
}
function convert()
{
var unit, direction, value, result, original_units, new_units;
document.write("<br/><br/>")
document.write("Weight and Length conversion menu" + "<br/><br/>");
document.write("1. convert length" + "<br />");
document.write("2. convert weight" + "<br />");
document.write("3. convert volume" + "<br />");
unit = window.prompt("select conversion type: ");
if ((unit<0) || (unit>3))
{
alert("Select Menu option 1, 2, or 3!");
unit = window.prompt("Select conversion type: ");
}
switch (unit)
{
case '1':
direction = choose_direction("<br /><br />1. Feet to meters<br />" , "2. Meters to feet <br />");
if (direction =='1')
{
original_units = "meters"; new_units = "meters";
}
else {
new_units = "feet"; original_units = "meters";
}
break;
case '2':
direction = choose_direction("<br /><br />1. Pounds to kilograms <br />", "2. Kilograms to pounds <br /> <br />");
if (direction =='1')
{
original_units = "pounds"; new_units = "kilograms";
}
else {
new_units = "pounds"; original_units = "kilograms";
}
break;
case '3':
direction = choose_direction("<br /><br />1. Gallons to liters<br />", "2. Liters to gallons <br /><br />");
if (direction =='1')
{
original_units = "gallons"; new_units = "liters";
}
else {
new_units = "gallons"; original_units = "liters";
}
break;
}
value = window.prompt("Enter value to be converted:")
switch(unit)
{
case '1':
result = feet_meters(value, direction);
break;
case '2':
result = pounds_kilograms(value, direction);
break;
case '3':
result = gallons_liters(value, direction);
break;
}
document.write(value + original_units + " = " + result + new_units);
}
function choose_direction(option1, option2)
{
var direction;
document.write(option1);
document.write(option2);
do
{
window.prompt("Select a conversion direction");
return direction;
}
while ((direction!='1') || (direction !='2'));
}
function pounds_kilograms(value, direction)
{
if (direction == '1')
return parseFloat(value)/parseFloat(2.2046);
else
return parseFloat(value)*parseFloat(2.2046);
}
function gallons_liters(value, direction)
{
if (direction == '1')
return parseFloat(value)*parseFloat(3.7854);
else
return parseFloat(value)/parseFloat(3.7854);
}
function feet_meters(value, direction)
{
if (direction == '1')
return parseFloat(value)/parseFloat(3.2808);
else
return parseFloat(value)*parseFloat(3.2808);
}
</script>
</head>
<body>
<h1> weight and length conversion </h1>
<script type="text/javascript">
convert();
main();
</script>
</body>
</html>
I've been looking around and all the validation stuff I've seen doesn't work for what I have. Here is what I am trying to do: The user selects the Heads or Tails radio button for the first flip and then selects heads or tails radio button for the 2nd flip. The script then randomly flips two coins and compares it to what the user selected and if they are the same the user wins and if not then they lose. So there would be 4 buttons total, two Heads and two Tails. The first set of Heads and Tails needs to be assigned to "guess1" and the 2nd set is "guess2". So if the user clicks Tails for Flip1 and Heads for Flip2 then Tails is assigned to guess1 and Heads is assigned to guess2. Right now the script just assumes the user is selecting heads for both flips. Code: <html>
<head>
<title>Guess Two Coin Tosses</title>
<script>
function flip5(){
//Input
var guess1 = document.getElementById('guess1').value
var guess2 = document.getElementById('guess2').value
var flip1 = Math.floor(Math.random() * 2)
var flip2 = Math.floor(Math.random() * 2)
var outcomes
if (flip1 == 0) flip1 = 'Heads';
else flip1 = 'Tails';
if (flip2 == 0) flip2 = 'Heads';
else flip2 = 'Tails';
//Processing
if (flip1.toUpperCase() == guess1.toUpperCase()) {
if (flip2.toUpperCase() == guess2.toUpperCase())
outcomes = 'win win';
else
outcomes = 'win lose';
}
else { // here we lost the first
if (flip2.toUpperCase() == guess2.toUpperCase())
outcomes = 'lose win';
else
outcomes = 'lose lose';
}
//Output
document.getElementById('flip1').value = flip1
document.getElementById('flip2').value = flip2
document.getElementById('outcomes').value = outcomes
}
</script>
</head>
<body>
<h3>Predict the Futu Guess Two Coin Flips</h3>
Enter Heads for Heads, Tails for Tails! Case does not matter!
<p/>Your Guess for Flip-1:
<input type=radio id="guess1" size="5" value="Heads" />Heads
<input type=radio id="guess1" size="5" value="Tails" />Tails
<p/>Your Guess for Flip-2:
<input type=radio id="guess2" size="5" value="Heads" />Heads
<input type=radio id="guess2" size="5" value="Tails" />Tails
<p/>Flip-1:
<input type="text" id="flip1" size="5" value="???" />
<p/>Flip-2:
<input type="text" id="flip2" size="5" value="???" />
<p/><input type="button" value="Flip Two!"
onclick="flip5()" />
<p/>Outcomes:
<input type="text" id="outcomes" size="20" value="" />
<hr>
</body>
</html>
I have an assignment do tomorrow and the program worked then i saved turned it off and today it don't plz help oh and im not that good so try to be simple :P Code:
<html>
<head>
<script type="text/javascript">
//Egon Klein
//W0637104
//MIT153
function calculate()
{
//Cm - Cm
var INPUT = document.getElementById("input");
if (CM1.checked && CM2.checked) {document.write(INPUT.value)}
//Km - Km
var INPUT = document.getElementById("input");
if (KM1.checked && KM2.checked) {document.write(INPUT.value)}
//Meters - Meters
var INPUT = document.getElementById("input");
if (METERS1.checked && METERS2.checked) {document.write(INPUT.value)}
//Cm - Meters
var INPUT = document.getElementById("input");
if (CM1.checked && METERS2.checked) {document.write(INPUT.value/100)}
// Cm - Km
var INPUT = document.getElementById("input");
if (CM1.checked && KM2.checked) {document.write(INPUT.value/100000)}
//Meters - Cm
var INPUT = document.getElementById("input");
if (METERS1.checked && CM2.checked) {document.write(INPUT.value*100)}
//Meters - Km
var INPUT = document.getElementById("input");
if (METERS1.checked && KM2.checked) {document.write(INPUT.value/1000)}
//Km - Cm
var INPUT = document.getElementById("input");
if (KM1.checked && CM2.checked) {document.write(INPUT.value*100000)}
//Km - Meters
var INPUT = document.getElementById("input");
if (KM1.checked && METERS2.checked) {document.write(INPUT.value*1000)}
// Cm - Inches
var INPUT = document.getElementById("input");
if (CM1.checked && INCHES2.checked) {document.write(INPUT.value*0.393700787)}
///////////////////////////////////////////////////////////////
//Km - Inches
var INPUT = document.getElementById("input");
if (KM1.checked && INCHES2.checked) {document.write(INPUT.value*39 370.0787)}
//Meters - Inches
var INPUT = document.getElementById("input");
if (METERS1.checked && INCHES2.checked) {document.write(INPUT.value*39.3700787)}
//Cm - Feet
var INPUT = document.getElementById("input");
if (CM1.checked && FEET2.checked) {document.write(INPUT.value*0.032808399)}
//Km - Feet
var INPUT = document.getElementById("input");
if (KM1.checked && FEET2.checked) {document.write(INPUT.value*3280.8399)}
//Meters - Feet
var INPUT = document.getElementById("input");
if (METERS1.checked && FEET2.checked) {document.write(INPUT.value*3.2808399)}
//Cm - Yard
var INPUT = document.getElementById("input");
if (CM1.checked && YARD2.checked) {document.write(INPUT.value*0.010936133)}
//Km - Yard
var INPUT = document.getElementById("input");
if (KM1.checked && YARD2.checked) {document.write(INPUT.value*1 093.6133)}
//Meters - Yard
var INPUT = document.getElementById("input");
if (METERS1.checked && YARD2.checked) {document.write(INPUT.value*1.0936133)}
//Cm - Miles
var INPUT = document.getElementById("input");
if (CM1.checked && MILES2.checked) {document.write(INPUT.value*0.000006213712)}
//Km - Miles
var INPUT = document.getElementById("input");
if (KM1.checked && MILES2.checked) {document.write(INPUT.value*0.621371192)}
//Meters - Miles
var INPUT = document.getElementById("input");
if (METERS1.checked && MILES2.checked) {document.write(INPUT.value*0.000621371192)}
//Inches - Cm
var INPUT = document.getElementById("input");
if (INCHES1.checked && CM2.checked) {document.write(INPUT.value*2.54)}
//Inches - Km
var INPUT = document.getElementById("input");
if (INCHES1.checked && KM2.checked) {document.write(INPUT.value*0.0000254)}
//Inches - Meters
var INPUT = document.getElementById("input");
if (INCHES1.checked && METERS2.checked) {document.write(INPUT.value*0.0254)}
//Feet - Cm
var INPUT = document.getElementById("input");
if (FEET1.checked && CM2.checked) {document.write(INPUT.value*30.48)}
//Feet - Km
var INPUT = document.getElementById("input");
if (FEET1.checked && KM2.checked) {document.write(INPUT.value*0.0003048)}
//Feet - Meters
var INPUT = document.getElementById("input");
if (FEET1.checked && METERS2.checked) {document.write(INPUT.value*0.3048)}
//Yard - Cm
var INPUT = document.getElementById("input");
if (YARD1.checked && CM2.checked) {document.write(INPUT.value*91.44)}
//Yard - Km
var INPUT = document.getElementById("input");
if (YARD1.checked && KM2.checked) {document.write(INPUT.value*0.0009144)}
//Yard - Meters
var INPUT = document.getElementById("input");
if (YARD1.checked && METERS2.checked) {document.write(INPUT.value*0.9144)}
//Miles - Cm
var INPUT = document.getElementById("input");
if (MILES1.checked && CM2.checked) {document.write(INPUT.value*160 934.4)}
//Miles - Km
var INPUT = document.getElementById("input");
if (MILES1.checked && KM2.checked) {document.write(INPUT.value*1.609344)}
//Miles - Meters
var INPUT = document.getElementById("input");
if (MILES1.checked && METERS2.checked) {document.write(INPUT.value*1609.344)}
//Inches - Inches
var INPUT = document.getElementById("input");
if (INCHES1.checked && INCHES2.checked) {document.write(INPUT.value)}
//Inches - Feet
var INPUT = document.getElementById("input");
if (INCHES1.checked && FEET2.checked) {document.write(INPUT.value*0.0833333333)}
//Inches - Yard
var INPUT = document.getElementById("input");
if (INCHES1.checked && YARD2.checked) {document.write(INPUT.value*0.0277777778)}
//Inches - Miles
var INPUT = document.getElementById("input");
if (MILES1.checked && MILES2.checked) {document.write(INPUT.value*0.0000157828283)}
//Feet - Feet
var INPUT = document.getElementById("input");
if (FEET1.checked && FEET2.checked) {document.write(INPUT.value)}
//Feet - Inches
var INPUT = document.getElementById("input");
if (FEET1.checked && INCHES2.checked) {document.write(INPUT.value*12)}
//Feet - Yard
var INPUT = document.getElementById("input");
if (FEET1.checked && YARD2.checked) {document.write(INPUT.value*0.33333333)}
//Feet - Miles
var INPUT = document.getElementById("input");
if (FEET1.checked && MILES2.checked) {document.write(INPUT.value*0.000189393939)}
//Yard - Yard
var INPUT = document.getElementById("input");
if (YARD1.checked && YARD2.checked) {document.write(INPUT.value)}
//Yard - Feet
var INPUT = document.getElementById("input");
if (YARD1.checked && FEET2.checked) {document.write(INPUT.value*3)}
//Yard - Inches
var INPUT = document.getElementById("input");
if (YARD1.checked && INCHES2.checked) {document.write(INPUT.value*36)}
//Yard - Miles
var INPUT = document.getElementById("input");
if (YARD1.checked && MILES2.checked) {document.write(INPUT.value*0.000568181818)}
//Miles - Miles
var INPUT = document.getElementById("input");
if (MILES1.checked && MILES2.checked) {document.write(INPUT.value)}
//Miles - Inches
var INPUT = document.getElementById("input");
if (MILES1.checked && INCHES2.checked) {document.write(INPUT.value*63 360)}
//Miles - Feet
var INPUT = document.getElementById("input");
if (MILES1.checked && FEET2.checked) {document.write(INPUT.value*5280)}
//Miles - Yard
var INPUT = document.getElementById("input");
if (MILES1.checked && YARD2.checked) {document.write(INPUT.value*1760)}
}
</script>
</head>
<body>
<form>
<h4>Input Measurement:</h4>
<input type="text" id="input"/>
<input type="radio" name="Type1" id="CM1" checked="true"/>Cm
<input type="radio" name="Type1" id="KM1" checked="true"/>Km
<input type="radio" name="Type1" id="METERS1" checked="true"/>Meters
<input type="radio" name="Type1" id="INCHES1" checked="true"/>Inches
<input type="radio" name="Type1" id="FEET1" checked="true"/>Feet
<input type="radio" name="Type1" id="YARD1" checked="true"/>Yard
<input type="radio" name="Type1" id="MILES1" checked="true"/>Miles
<h4>Conversion Measurement:</h4>
<input type="radio" name="Type2" id="CM2" checked="true"/>Cm <br/>
<input type="radio" name="Type2" id="KM2" checked="true"/>Km <br/>
<input type="radio" name="Type2" id="METERS2" checked="true"/>Meters <br/>
<input type="radio" name="Type2" id="INCHES2" checked="true"/>Inches <br/>
<input type="radio" name="Type2" id="FEET2" checked="true"/>Feet <br/>
<input type="radio" name="Type2" id="YARD2" checked="true"/>Yard <br/>
<input type="radio" name="Type2" id="MILES2" checked="true"/>Miles <br/>
<input type="button" onclick="calculate()" value="Calculate"/>
</form>
</body>
</html>
I don't exactly know how to word my issue. Basically, I need it so that if a user selects 'option1' in the group 'group1' when they go to 'group2' is only gives them a certain selection to choose from. If they choose 'option2' in 'group1' they will get a different set to choose from. My main dilemma is it must do this without them having to submit. Hi, I could not get the radio to work. I need to be able tot select the different radio buttons in which it will produce different rates for calculation. But after reaching here, am not sure what is wrong with the coding as there are no error msgs, and it only uses the 18/0.18 rates, even when 25/0.28 rates are selected. Could someone advise me? Thanks Code as show below- Code: <a name="A"></a>
<script language="JavaScript">
function stocks(form) {
shares = form.shares.value * 1;
buyprice = form.buyprice.value * 1;
sellprice = form.sellprice.value * 1;
dividends = form.dividends.value * 1;
buyoption = form.buyoption.value * 1;
selloption = form.selloption.value * 1;
//Checking Buy Commission
if (buyoption>24)
{
bco1=25;
bco2=0.28;
}
else
{
bco1=18;
bco2=0.18;
}
//Checking Sell Commission
if (selloption>24)
{
sco1=25;
sco2=0.28;
}
else
{
sco1=18;
sco2=0.18;
}
//Calc Buying Cost
ba1=shares*buyprice;
ba2=bco1;
ba3=(shares*buyprice)/100*0.04;
ba4=(shares*buyprice)/100*0.0075;
ba5=(ba2+ba3+ba4)/100*7;
baf=Math.round((ba1+ba2+ba3+ba4+ba5)*100)/100;
bb1=shares*buyprice;
bb2=(shares*buyprice)/100*bco2;
bb3=(shares*buyprice)/100*0.04;
bb4=(shares*buyprice)/100*0.0075;
bb5=(bb2+bb3+bb4)/100*7;
bbf=Math.round((bb1+bb2+bb3+bb4+bb5)*100)/100;
//Compare Cost
if (baf>bbf)
{
bc=baf;
}
else
{
bc=bbf;
}
//Calc Selling Cost
sa1=shares*sellprice;
sa2=sco1;
sa3=(shares*sellprice)/100*0.04;
sa4=(shares*sellprice)/100*0.0075;
sa5=(sa2+sa3+sa4)/100*7;
saf=Math.round((sa1-(sa2+sa3+sa4+sa5))*100)/100;
sb1=shares*sellprice;
sb2=(shares*sellprice)/100*sco2;
sb3=(shares*sellprice)/100*0.04;
sb4=(shares*sellprice)/100*0.0075;
sb5=(sb2+sb3+sb4)/100*7;
sbf=Math.round((sb1-(sb2+sb3+sb4+sb5))*100)/100;
//Compare Returns
if (saf<sbf)
{
tr=saf;
}
else
{
tr=sbf;
}
//Calc Break Even Price
bepwod1=(bc/shares);
bepwd1=((bc-dividends)/shares);
bepwod=bepwod1.toFixed(3);
bepwd=bepwd1.toFixed(3);
//Calc Profit and Loss
plwod1=tr-bc;
plwd1=tr+dividends-bc;
plwod=plwod1.toFixed(3);
plwd=plwd1.toFixed(3);
//Returning Values
bought = bc; // Total Cost
sold = tr; // Total Returns
form.buycost.value = "$ " + bought;
form.sellcost.value = "$ " + sold;
form.breakevenpricewod.value = "$ " + bepwod;
form.breakevenpricewd.value = "$ " + bepwd;
form.profitlosswod.value = "$ " + plwod;
form.profitlosswd.value = "$ " + plwd;
}
</script>
<center>
<form name='stockform'>
<table border=0>
<tr>
<td align=left>* No. of Shares</td>
<td>:</td>
<td><input type="text" name="shares" /></td>
<td align=left>Total Cost</td>
<td>:</td>
<td><input type="text" readonly="readonly" name="buycost" /></td>
</tr>
<tr>
<td align=left>* Buying Price</td>
<td>:</td>
<td><input type="text" name="buyprice" /></td>
<td align=left>Total Returns</td>
<td>:</td>
<td><input type="text" readonly="readonly" name="sellcost" /></td>
</tr>
<tr>
<td align=left>* Selling Price</td>
<td>:</td>
<td><input type="text" name="sellprice" /></td>
<td align=left>Break Even Price w/o Dividends</td>
<td>:</td>
<td><input type="text" readonly="readonly" name="breakevenpricewod" /></td>
</tr>
<tr>
<td align=left>* Dividends</td>
<td>:</td>
<td><input type="text" name="dividends" /></td>
<td align=left>Break Even Price w Dividends</td>
<td>:</td>
<td><input type="text" readonly="readonly" name="breakevenpricewd" /></td>
</tr>
<tr>
<td align=left>Buy @ Commission</td>
<td>:</td>
<td><input type="radio" name="buyoption" value="18" checked>$18/0.18%<br>
<input type="radio" name="buyoption" value="25">$25/0.28%<br></td>
<td align=left>Profit & Loss w/o Dividends</td>
<td>:</td>
<td><input type="text" readonly="readonly" name="profitlosswod" /></td>
</tr>
<tr>
<td align=left>Sell @ Commission</td>
<td>:</td>
<td><input type="radio" name="selloption" value="18">$18/0.18%<br>
<input type="radio" name="selloption" value="25" checked>$25/0.28%<br></td>
<td align=left>Profit & Loss w Dividends</td>
<td>:</td>
<td><input type="text" readonly="readonly" name="profitlosswd" /></td>
</tr>
<tr>
<td colspan=3 align=center>
<input type="button" name="calc" value="Calculate" onclick="javascript:stocks(this.form)" />
</td>
<td align=left></td>
<td></td>
<td></td>
</tr>
</table>
</form>
</center>
hi can someone help me on my code on javascript sory im a newbie can you check this and help me what i need to do to add all the radio botton and check box. i already finish the add formula on the checkbox but i do not know how to add the two selected radio buttons to my checkbox buttons help please... for example: O selected is 80 O 60 O 60 O selected is 15 O 15 O 25 chkbox 22 chkbox 30 chkbox 8 Code: function Compute(form)
{
if(form.radio1[0].checked)
form.text1.value=form.radio1[0].value; <---- the value of this is 80
else if(form.radio1[1].checked)
form.text1.value=form.radio1[1].value; <---- 60
else if(form.radio1[2].checked)
form.text1.value=form.radio1[2].value; <---- 60
else if(form.radio1[0].checked)
form.text1.value=form.radio1[0].value; <---- 15
else if(form.radio2[1].checked)
form.text1.value=form.radio2[1].value; <---- 15
else if(form.radio2[2].checked)
form.text1.value=form.radio2[2].value; <---- 25
var a=0;
if(form.chk1.checked) <----22
a = a + eval(form.chk1.value);
if(form.chk2.checked) <----30
a = a + eval(form.chk2.value);
if(form.chk3.checked) <----8
a = a + eval(form.chk3.value);
if(form.chk1.checked && form.chk2.checked)
a = eval(form.chk1.value) + eval(form.chk2.value);
if(form.chk1.checked && form.chk3.checked)
a = eval(form.chk1.value) + eval(form.chk3.value);
if(form.chk2.checked && form.chk1.checked)
a = eval(form.chk2.value) + eval(form.chk1.value);
if(form.chk2.checked && form.chk3.checked)
a = eval(form.chk2.value) + eval(form.chk3.value);
if(form.chk3.checked && form.chk1.checked)
a = eval(form.chk3.value) + eval(form.chk1.value);
if(form.chk3.checked && form.chk2.checked)
a = eval(form.chk3.value) + eval(form.chk2.value);
if(form.chk1.checked && form.chk2.checked && form.chk3.checked)
a = eval(form.chk1.value) + eval(form.chk2.value) + eval(form.chk3.value);
form.text1.value=a;
}
I'm Confused. My HTML: <form action="mail.php" class="contactForm" name="cform" method="post"> <div class="left"> <h1>Insurance Details</h1> <label>Type of Cover:</label> . . . <span class="gender-missing"><br />Please select your gender.<br /></span> <label>Gender:</label> <input class="radio" id="gender" name="gender" type="radio" value="Male" /> Male <input class="radio" id="gender" name="gender" type="radio" value="Female" /> Female Script.js: $('.contactForm').submit( function(){ //statements to validate the form var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/; var digitNum = /^([0-9])/; var num1 = document.getElementById('tel'); var num2 = document.getElementById('mobile'); var email = document.getElementById('email'); var dollarUnit = document.getElementById('amount_cover'); var gender = document.getElementsById('gender'); if((document.cform.gender[0].checked== false)&&(document.cform.gender[1].checked== false)) {$('.gender-missing').show(); } else {$('.gender-missing').hide();} if((document.cform.smoke[0].checked== false)&&(document.cform.smoke[1].checked== false)) {$('.smoke-missing').show(); } else {$('.smoke-missing').hide();} if((document.cform.residency[0].checked== false)&&(document.cform.residency[1].checked== false)) {$('.residency-missing').show(); } else {$('.residency-missing').hide();} if (!filter.test(email.value)) { $('.email-missing').show(); } else {$('.email-missing').hide();} if (document.cform.name.value == "") { $('.name-missing').show(); } else {$('.name-missing').hide();} if (document.cform.address.value == "") { $('.address-missing').show(); } else {$('.address-missing').hide();} if (!digitNum.test(num1.value)) { $('.tel-missing').show(); } else {$('.tel-missing').hide();} if (!digitNum.test(num2.value)) { $('.mobile-missing').show(); } else {$('.mobile-missing').hide();} if (!digitNum.test(dollarUnit.value)) { $('.cover-missing').show(); } else {$('.cover-missing').hide();} if (document.cform.message.value == "") { $('.message-missing').show(); } else {$('.message-missing').hide();} if ((document.cform.name.value == "") || ((document.cform.gender[0].checked== false) && (document.cform.gender[1].checked== false)) || ((document.cform.smoke[0].checked== false) && (document.cform.smoke[1].checked== false)) || ((document.cform.residency[0].checked== false) && (document.cform.residency[1].checked== false)) || (!digitNum.test(dollarUnit.value)) || (!filter.test(email.value)) || (!digitNum.test(num2.value)) || (!digitNum.test(num1.value)) || (document.cform.message.value == "")){ return false; } if ((document.cform.name.value != "") && ((document.cform.gender[0].checked == true) || (document.cform.gender[1].checked == true)) && ((document.cform.smoke[0].checked== true) || (document.cform.smoke[1].checked== true)) && ((document.cform.residency[0].checked== true) || (document.cform.residency[1].checked== true)) && (digitNum.test(dollarUnit.value)) && (digitNum.test(num1.value)) && (digitNum.test(num2.value)) && (filter.test(email.value)) && (document.cform.message.value != "")) { //hide the form $('.contactForm').hide(); //show the loading bar $('.loader').append($('.bar')); $('.bar').css({display:'block'}); //send the ajax request $.post('mail.php',{coverType:$('#coverType').val(), coverRequired:$('#coverRequired').val(), amount_cover:$('#amount_cover').val(), terms:$('#terms').val(), message:$('#message').val(), name:$('#name').val(), gender:$('#gender').val(), status:$('#status').val(), Birth_month:$('#Birth_month').val(), days:$('#days').val(), years:$('#years').val(), smoke:$('#smoke').val(), residency:$('#residency').val(), email:$('#email').val(), address:$('#address').val(), tel:$('#tel').val(), mobile:$('#mobile').val()}, //return the data function(data){ //hide the graphic $('.bar').css({display:'none'}); $('.loader').append(data); }); //waits 2000, then closes the form and fades out setTimeout('$("#backgroundPopup").fadeOut("slow"); $("#contactForm").slideUp("slow")', 5000); setTimeout('$(".contact").animate({"marginLeft": "-=963px"}, "slow")',4900); //stay on the page return false; } }); //only need force for IE6 $("#backgroundPopup").css({ "height": document.documentElement.clientHeight }); mail.php code: <?php //declare our variables $coverType = $_POST['coverType']; $coverRequired = $_POST['coverRequired']; $amount_cover = $_POST['amount_cover']; $terms = $_POST['terms']; $message = stripslashes(nl2br($_POST['message'])); $name = $_POST['name']; $gender = $_POST['gender']; $status = $_POST['status']; $Birth_month = $_POST['Birth_month']; $days = $_POST['days']; $years = $_POST['years']; $smoke = $_POST['smoke']; $residency = $_POST['residency']; $email = $_POST['email']; $address = $_POST['address']; $tel = $_POST['tel']; $mobile = $_POST['mobile']; //get todays date $todayis = date("l, F j, Y, g:i a") ; //set a title for the message $subject = "Message from Your Website"; $body = "PERSONAL DETAILS \nFull Name: $name \nGender: $gender \nMarital Status: $status \nBirth Date: $Birth_month $days, $years \nHave you smoke in the past 12 Months? $smoke \nU.S. Residency for at least 12 Months? $residency \n\nCONTACT DETAILS\nEmail Address: $email \nAddress: $address \nTelephone #: $tel \nMobile Number: $mobile \n\nINSURANCE DETAILS\nCover Type: $coverType \nCover Required: $coverRequired \nAmount: $amount_cover \nTerms(Years): $terms \nMessage: \n$message"; $headers = 'From: '.$email.'' . "\r\n" . 'Reply-To: '.$email.'' . "\r\n" . 'Content-type: text/plain; charset=utf-8' . "\r\n" . 'X-Mailer: PHP/' . phpversion(); //put your email address here mail("me@myemail.com", $subject, $body, $headers); ?> <!--Display a thankyou message in the callback --> <div id="mail_response"> <h3>Thank you for your interest <?php echo $name ?>!</h3><br /> <p>We have received your personal information and we will forward it to the next available insurance agent .You can expect to hear from us within 24 hours.</p> <br /><br /> <h5>Message sent on: </h5> <p><?php echo $todayis ?></p> </div> Problem is the thank you message loads in a new page. BUt if I delete this line: var gender = document.getElementsById('gender'); The form run properly, when submit button is click, it will hide the forms and replace by a thank you message but problem is the data send in the email is not the right value eg. in Gender: I select Female. BUt I receive Male as value. Why is that? for live demo: http://gbv.lifeandhealthbenefits.com/ for full Script Code: http://gbv.lifeandhealthbenefits.com/js/scripts.js On my website I have a radio button as any other normal radio button. <input type="radio" name="crime" value="4" id="4" class="submit"> is there any way to get rid of this radio button and click something for example <tr> <td>Blah blah</td> <td>Blah Blah</td> </tr> is there any code i can put in the <tr> tag so if i click that section it will act as a radio button and when its selected change the background of the tr section. Thanks for clicking on this to possibly help me. I've been trying for hours to get my page to do one calculations when a radio is clicked... or to do another if a different radio is clicked. any help would be GREATLY appreciated. here is a simplified version of the code (it'd be pointless to give you the whole code, it's way too big.) Code: <html>
<head>
<title>This doesn't work...</title>
</head>
<body>
<script type="text/javascript">
function doit(){
var firstnum = form.num1.value - form.num2.value;
var secondnum = form.num1.value + form.num2.value;
if (form.op1.checked){
form.results.value = firstnum;
}
if (form.op2.checked){
form.results.value = secondnum;
}
}
</script>
<form name="form" method="post">
Num 1: <input type="text" name="num1" /><br />
Num 2: <input type="text" name="num2" /><br />
Option One <input type="radio" name="op1" /><br />
Option Two <input type="radio" name="op2" /><br />
<input type="submit" onClick="doit" /><br />
Results: <input type="text" name="results" /><br />
</form>
</body>
</html>
On my website I have a radio button as any other normal radio button. <input type="radio" name="crime" value="4" id="4" class="submit"> is there any way to get rid of this radio button and click something for example <tr> <td>Blah blah</td> <td>Blah Blah</td> </tr> is there any code i can put in the <tr> tag so if i click that section it will act as a radio button and when its selected change the background of the tr section. hello, this is my first attempt in javascript. im trying to make custom radio buttons here is the code i have: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style type="text/css">
.hide {display:none;}
.radio {width:16px;height:16px;}
</style>
<script type="text/javascript">
// declare variables or different states
var off = 'images/check-off.png';
var on = 'images/check-on.png';
var radioImage = document.createElement('img');
function replaceRadios(){
var radios = document.getElementsByName('radio1');
radios.type = 'radio'
for (r = 1; r < radios.length; r++) {
// if radio is checked configure the img src to var on
if (radios[r].type = 'radio' && radios[r].checked) {
radioImage.src = on;
radioImage.className= 'radio on';
} else {
// otherwise configure the img src to var normal/off and give it a class of radio
radioImage.src = off;
radioImage.className= 'radio off';
}
// give the image an id of radio
radioImage.className = 'radio';
radioImage.onclick= radioStates;
radios[r].parentNode.insertBefore(radioImage,radios[r]);
// hide the radio button to show image
radios[r].className = 'hide';
}
}
function radioStates(r) {
var radios = document.getElementsByName('radio1');
if (radios.checked = true) {
radioImage.setAttribute("class", "radio on");
radioImage.src = on;
} else if (radios.checked = false) {
radioImage.setAttribute("class", "radio off");
radioImage.src = off;
} else {
radioImage.setAttribute("class", "radio off");
radioImage.src = off;
}
}
setTimeout("replaceRadios()", 0);
</script>
</head>
<body>
<form name="radiotest">
<input type="radio" id="radio1" class="radio" name="radio1" />
<input type="radio" id="radio2" class="radio" name="radio1" />
<input type="submit" id="submit" name="submit" />
</form>
</body>
</html>
If anyone could help me, I would greatly appreciate it. Hi I was helped to find the example below to show which presenter is on air now to be displayed on my website. At the moment this displays: DJ Name DJ Photo What I would like it to display is: DJ Name DJ Description DJ Photo Can anyone tell me how to achieve this? Code: function display() {
var show = "No show scheduled at present";
var GMToffset = -0; // Your current GMT offset, whether Standard or Daylight
var now = new Date();
var dy = now.getDay(); // day of week 0-6
now.setHours(GMToffset + now.getHours() + now.getTimezoneOffset() / 60);
var hh = now.getHours();
var mn = now.getMinutes();
hh = hh + (mn/60); // minutes expressed as fractions of an hour
// The GMT offset ensures that every visitor, regardless of their timezone, will see the schedule
// that is appropriate for the site owner's local time.
// Tip - for testing purposes you can put here
//dy = 5;
//hh = 9.25;
// or whatever to check that the right show appears at that day/time.
if (dy >=1 && dy <=4) { // days in Javascript are 0 Sunday - 6 Saturday
if (hh >=0 && hh <7) {show = "DJ0"; document.getElementById("theImage").src = "3trfm_template/presenters/xxx.png"}
if (hh >=7 && hh <11) {show = "DJ1"; document.getElementById("theImage").src = "3trfm_template/presenters/xxx.png"}
if (hh >=11 && hh <14) {show = "DJ2"; document.getElementById("theImage").src = "3trfm_template/presenters/xxx.png"}
if (hh >=14 && hh <19) {show = "DJ3"; document.getElementById("theImage").src = "3trfm_template/presenters/xxx.png"}
if (hh >=19 && hh <22) {show = "DJ0"; document.getElementById("theImage").src = "3trfm_template/presenters/xxx.png"}
if (hh >=22 && hh <=23) {show = "DJ0"; document.getElementById("theImage").src = "3trfm_template/presenters/xxx.png"}
}
if (dy == 5) {
if (hh >=0 && hh <7) {show = "DJ0"; document.getElementById("theImage").src = "3trfm_template/presenters/xxx.png"}
if (hh >=7 && hh <11) {show = "DJ1"; document.getElementById("theImage").src = "3trfm_template/presenters/xxx.png"}
if (hh >=11 && hh <14) {show = "DJ2"; document.getElementById("theImage").src = "3trfm_template/presenters/xxx.png"}
if (hh >=14 && hh <19) {show = "DJ3"; document.getElementById("theImage").src = "3trfm_template/presenters/xxx.png"}
if (hh >=19 && hh <=23) {show = "DJ0"; document.getElementById("theImage").src = "3trfm_template/presenters/xxx.png"}
}
if (dy == 6) { // Saturday Note the two = signs to mean equals
if (hh >=0 && hh <8) {show = "DJ0"; document.getElementById("theImage").src = "3trfm_template/presenters/xxx.png"}
if (hh >=8 && hh <12) {show = "DJ3"; document.getElementById("theImage").src = "3trfm_template/presenters/xxx.png"}
if (hh >=12 && hh <14) {show = "DJ2"; document.getElementById("theImage").src = "3trfm_template/presenters/xxx.png"}
if (hh >=14 && hh <18) {show = "DJ4"; document.getElementById("theImage").src = "3trfm_template/presenters/xxx.png"}
if (hh >=18 && hh <20) {show = "DJ5"; document.getElementById("theImage").src = "3trfm_template/presenters/xxx.png"}
if (hh >=20 && hh <=23) {show = "DJ0"; document.getElementById("theImage").src = "3trfm_template/presenters/xxx.png"}
} //End of Saturday Shows
if (dy == 0) { //Sunday Shows
if (hh >=0 && hh <8) {show = "DJ0"; document.getElementById("theImage").src = "3trfm_template/presenters/xxx.png"}
if (hh >=8 && hh <12) {show = "DJ4"; document.getElementById("theImage").src = "3trfm_template/presenters/xxx.png"}
if (hh >=12 && hh <16) {show = "DJ6"; document.getElementById("theImage").src = "3trfm_template/presenters/xxx.png"}
if (hh >=16 && hh <19) {show = "DJ7"; document.getElementById("theImage").src = "3trfm_template/presenters/xxx.png"}
if (hh >=19 && hh <22) {show = "DJ7"; document.getElementById("theImage").src = "3trfm_template/presenters/xxx.png"}
if (hh >=22 && hh <=23) {show = "DJ0"; document.getElementById("theImage").src = "3trfm_template/presenters/xxx.png"}
} // End of Sunday Shows
var a = "" + show + " \u00A0 \u00A0 \u00A0 \u00A0 "; // spaces must be separted by Unicode spaces to prevent collapse
document.getElementById("dj").innerHTML = a;
setTimeout("display()", 60000); // update every 60 seconds
}
Hi, I've used this site before and grabbed the code for the 'On Air Now' which displays the current DJ etc. I've managed to get to grips with the javascript code and used the vars to create DJ descriptions and additionally time too. However, I am struggling with displaying the image in a DIV tag. What am I doing wrong here? Code: <script>
$(document).ready(function() {
$("dj").load("a");
var refreshId = setInterval(function() {
$("dj").load('a?randval='+ Math.random());
}, 60000);
$.ajaxSetup({ cache: false });
});
</script>
<script type = "text/javascript">
function display() {
var show = "No show scheduled at present";
var desc = "";
var DJdesc = [];
DJdesc[1] = "Non stop music to get you through the early hours";
DJdesc[2] = "Early riser or insomniac, we keep the hits playing";
DJdesc[3] = "Jump start your day with Today's Best Mix!"
DJdesc[4] = "We keep the hits playing while you're at work! Send us a request on Twitter @tmrextra or find us on facebook"
DJdesc[5] = "The biggest hits from The Mix Radio Extra's playlist on your ride home"
DJdesc[6] = "Today's Best Mix... Old Skool Anthems, Hit Music & Classic Hits"
DJdesc[7] = "Wind down after another busy day with Extra Goes Quiet playing the best selection of cool and relaxing music."
DJdesc[8] = "The biggest dancefloor fillers of all time"
var on = "";
var DJon = [];
DJon[1] = "12am - 5am";
DJon[2] = "5am - 7am";
DJon[3] = "7am - 10am"
DJon[4] = "10am - 4pm"
DJon[5] = "4pm - 7pm"
DJon[6] = "7pm - 11pm"
DJon[7] = "11pm - 12am"
DJon[8] = "7pm - 12am"
DJon[9] = "10am - 7pm"
DJon[10] = "10am - 11pm"
// and so on
var GMToffset = 0; // Your current GMT offset, whether Standard or Daylight
var now = new Date();
var dy = now.getDay(); // day of week 0-6
now.setHours(GMToffset + now.getHours() + now.getTimezoneOffset() / 60);
var hh = now.getHours();
var mn = now.getMinutes();
hh = hh + (mn/60); // minutes expressed as fractions of an hour
// The GMT offset ensures that every visitor, regardless of their timezone, will see the schedule
// that is appropriate for the site owner's local time.
// Tip - for testing purposes you can put here
//dy = 5;
//hh = 9.25;
// or whatever to check that the right show appears at that day/time.
//Monday to Thursday
if (dy >=1 && dy <=4) { // days in Javascript are 0 Sunday - 6 Saturday
if (hh >=0 && hh <5) {show = "Extra at Night"; desc = DJdesc[1]; on = DJon[1]; document.getElementById("image").src = "images/nonstop.png";}
if (hh >=5 && hh <7) {show = "Extra Early"; desc = DJdesc[2]; on = DJon[2]; document.getElementById("image").src = "images/nonstop.png";}
if (hh >=7 && hh <10) {show = "Extra in the Morning"; desc = DJdesc[3]; on = DJon[3]; document.getElementById("image").src = "images/nonstop.png";}
if (hh >=10 && hh <16) {show = "Extra Hits"; desc = DJdesc[4]; on = DJon[4]; document.getElementById("image").src = "images/hits.jpg";}
if (hh >=16 && hh <19) {show = "Extra's Ride Home"; desc = DJdesc[5]; on = DJon[5]; document.getElementById("image").src = "images/home.jpg";}
if (hh >=19 && hh <23) {show = "Extra Hits"; desc = DJdesc[6]; on = DJon[6]; document.getElementById("image").src = "images/hits.jpg";}
if (hh >=23 && hh <24) {show = "Extra Goes Quiet"; desc = DJdesc[7]; on = DJon[7]; document.getElementById("image").src = "images/egq.jpg";}
}
//Friday
if (dy >=5 && dy <=5) {
if (hh >=0 && hh <5) {show = "Extra at Night"; desc = DJdesc[1]; on = DJon[1]; document.getElementById("image").src = "images/nonstop.png";}
if (hh >=5 && hh <7) {show = "Extra Early"; desc = DJdesc[2]; on = DJon[2]; document.getElementById("image").src = "images/nonstop.png";}
if (hh >=7 && hh <10) {show = "Extra in the Morning"; desc = DJdesc[3]; on = DJon[3]; document.getElementById("image").src = "images/nonstop.png";}
if (hh >=10 && hh <16) {show = "Extra Hits"; desc = DJdesc[4]; on = DJon[4]; document.getElementById("image").src = "images/hits.jpg";}
if (hh >=16 && hh <19) {show = "Extra's Ride Home"; desc = DJdesc[5]; on = DJon[5]; document.getElementById("image").src = "images/home.jpg";}
if (hh >=19 && hh <24) {show = "Club Classics"; desc = DJdesc[8]; on = DJon[8]; document.getElementById("image").src = "images/clubclassix.png";}
}
//Saturday
if (dy >=6 && dy <=6) {
if (hh >=0 && hh <5) {show = "Extra at Night"; desc = DJdesc[1]; on = DJon[1]; document.getElementById("image").src = "images/nonstop.png";}
if (hh >=5 && hh <7) {show = "Extra Early"; desc = DJdesc[2]; on = DJon[2]; document.getElementById("image").src = "images/nonstop.png";}
if (hh >=7 && hh <10) {show = "Extra in the Morning"; desc = DJdesc[3]; on = DJon[3]; document.getElementById("image").src = "images/nonstop.png";}
if (hh >=10 && hh <19) {show = "Extra Hits: Weekend"; desc = DJdesc[4]; on = DJon[9]; document.getElementById("image").src = "images/weekend.jpg";}
if (hh >=19 && hh <24) {show = "Club Classics"; desc = DJdesc[8]; on = DJon[8]; document.getElementById("image").src = "images/clubclassix.png";}
}
//Sunday
if (dy >=7 && dy <=7) {
if (hh >=0 && hh <5) {show = "Extra at Night"; desc = DJdesc[1]; on = DJon[1];}
if (hh >=5 && hh <7) {show = "Extra Early"; desc = DJdesc[2]; on = DJon[2];}
if (hh >=7 && hh <10) {show = "Extra in the Morning"; desc = DJdesc[3]; on = DJon[3];}
if (hh >=10 && hh <23) {show = "Extra Hits: Weekend"; desc = DJdesc[4]; on = DJon[10];}
if (hh >=23 && hh <24) {show = "Extra Goes Quiet"; desc = DJdesc[7]; on = DJon[7];}
}
var a = "" + show + " \u00A0 \u00A0 \u00A0 \u00A0 "; // spaces must be separted by Unicode spaces to prevent collapse
document.getElementById("dj").innerHTML = a;
document.getElementById("DJdescription").innerHTML = desc;
document.getElementById("DJon").innerHTML = on;
setTimeout("display()", 60000); // update every 60 seconds
}
</script>
</head>
<body onload = "display(dj,DJdescription,image)">
<div id="apDiv4"></div>
<div id="image"></div>
</div>
<div id="apDiv27"><span class="style8" id="dj"></span></div>
I originally tried using the following inside the div tag but it would only display the src'd item... Code: <div id="image"><img id="image" src="images/nonstop.png"></div></div> Any advice please? This has been racking my brains for a good week now. Thank you Reply With Quote 12-14-2014, 01:03 AM #2 Old Pedant View Profile View Forum Posts Supreme Master coder! Join Date Feb 2009 Posts 28,311 Thanks 82 Thanked 4,754 Times in 4,716 Posts You used id="image" TWICE! IDs *must* be unique on a page! You probably then tried to use document.getElementById("image") but that gives you an error because of the duplicate IDs. Wondering how come this doesn't work any ideas? its validating that the radio buttons have been selected. Code: if ( ( form.q1[0].checked == false ) && ( form.q2[1].checked == false) && ( form.q3[2].checked == false )) { alert ( "Please Choose a " ); return false; }
I have the following code which I want to make a selection and the value should reflect in the text box and the text box should take on that value for future calculations. Code: <!-- Row 13, Col 1 Order Value -->
<tr><td colspan="2" align="right">Delivery Options:
<input type="radio" name="sapo" value="35" onclick="deliveryCost('35')" /> R35 - SA Post Office
<input type="radio" name="sapo" value="80" onclick="deliveryCost('80')" /> R80 - Speed Services
<input type="radio" name="sapo" value="150" onclick="deliveryCost('150')" /> R150 - Courier Services
</td>
<!-- Row 13, Col 2 Order Value Box-->
<td colspan="1" align="left"><input style="margin-left: 60px" type="text" name="delivery" size="10" readonly="readonly" />
</td></tr>
Just wondering what the code would be to validate the radio buttons, thus when i click get score a pop up will tell me that one of the radio buttons was not selected. If you really want to help me it would be good if i was able to have get score and submit working on one button, and validating every field. My code is below (don't mind the questions and answers ) Code: <HEAD>
<script language="JavaScript">
var numQues = 5;
var numChoi = 3;
var answers = new Array(5);
answers[0] = "Life";
answers[1] = "Disturbing";
answers[2] = "Yahoo Answers";
answers[3] = "Playing Video Games in the Basement";
answers[4] = "About the portion of my Sandwich";
function getScore(form) {
var score = 0;
var currElt;
var currSelection;
for (i=0; i<numQues; i++) {
currElt = i*numChoi;
for (j=0; j<numChoi; j++) {
currSelection = form.elements[currElt + j];
if (currSelection.checked) {
if (currSelection.value == answers[i]) {
score++;
break;
}
}
}
}
score = Math.round(score/numQues*100);
form.percentage.value = score + "%";
var correctAnswers = "";
for (i=1; i<=numQues; i++) {
correctAnswers += i + ". " + answers[i-1] + "\r\n";
}
form.solutions.value = correctAnswers;
}
function validate_required(field,alerttxt)
{
with (field)
{
if (value==null||value=="")
{
alert(alerttxt);return false;
}
else
{
return true;
}
}
}
function echeck(str) {
var at="@"
var dot="."
var lat=str.indexOf(at)
var lstr=str.length
var ldot=str.indexOf(dot)
if (str.indexOf(at)==-1){
alert("Please Enter a Valid E-mail")
return false
}
if (str.indexOf(at)==-1 || str.indexOf(at)==0 || str.indexOf(at)==lstr){
alert("Please Enter a Valid E-mail")
return false
}
if (str.indexOf(dot)==-1 || str.indexOf(dot)==0 || str.indexOf(dot)==lstr){
alert("Please Enter a Valid E-mail")
return false
}
if (str.indexOf(at,(lat+1))!=-1){
alert("Please Enter a Valid E-mail")
return false
}
if (str.substring(lat-1,lat)==dot || str.substring(lat+1,lat+2)==dot){
alert("Please Enter a Valid E-mail")
return false
}
if (str.indexOf(dot,(lat+2))==-1){
alert("Please Enter a Valid E-mail")
return false
}
if (str.indexOf(" ")!=-1){
alert("Please Enter a Valid E-mail")
return false
}
return true
}
function validate_form(thisform)
{
with (thisform)
{
if (validate_required(Name,"Name must be filled out!")==false)
{Name.focus();return false;}
if (validate_required(Surname,"Surname must be filled out!")==false)
{Surname.focus();return false;}
{
var emailID=document.submitting.email
if ((emailID.value==null)||(emailID.value=="")){
alert("Please Enter a Valid E-mail")
emailID.focus()
return false
}
if (echeck(emailID.value)==false){
emailID.value=""
emailID.focus()
return false
}
return true
}
}
}
</script>
</HEAD>
<BODY>
<h3>Quiz</h3>
<form name="quiz">
1. What do i win at..?
<ul style="margin-top: 1pt">
<li><input type="radio" name="q1" value="Life">Life</li>
<li><input type="radio" name="q1" value="Nothing At All">Nothing At All</li>
<li><input type="radio" name="q1" value="Using a Computer">Using a Computer</li>
</ul>
2. My Life is..?
<ul style="margin-top: 1pt">
<li><input type="radio" name="q2" value="Boring">Boring</li>
<li><input type="radio" name="q2" value="Disturbing">Disturbing</li>
<li><input type="radio" name="q2" value="Like everyone elses">Like everyone elses</li>
</ul>
3. I don't learn off my mother i learn off ..?
<ul style="margin-top: 1pt">
<li><input type="radio" name="q3" value="Google">Google</li>
<li><input type="radio" name="q3" value="Yahoo Answers">Yahoo Answers</li>
<li><input type="radio" name="q3" value="The Bible">The Bible</li>
</ul>
4. I Spend Most of my time ..?
<ul style="margin-top: 1pt">
<li><input type="radio" name="q4" value="Cutting Down Palm Tree's">Cutting Down Palm Tree's</li>
<li><input type="radio" name="q4" value="Eating">Eating</li>
<li><input type="radio" name="q4" value="Playing Video Games in the Basement">Playing Video Games in the Basement</li>
</ul>
5. I Complain the most about ..?
<ul style="margin-top: 1pt">
<li><input type="radio" name="q5" value="JavaScript">JavaScript</li>
<li><input type="radio" name="q5" value="About the portion of my Sandwich">About the portion of my Sandwich</li>
<li><input type="radio" name="q5" value="Lag">Lag</li>
</ul>
<input type="button" value="Get score" onClick="getScore(this.form)">
<input type="reset" value="Clear answers">
<p> Score = <strong><input class="bgclr" type="text" size="5" name="percentage" disabled></strong><br><br>
Correct answers:<br>
<textarea class="bgclr" name="solutions" wrap="virtual" rows="4" cols="30" disabled>
</textarea>
</form>
<form action="submit.htm" onsubmit="return validate_form(this)" method="post" name="submitting">
Name:
<input type="text" name="Name" size="30">
<br>
<br>
Surname: <input type="text" name="Surname" size="30"><br><br>
Email: <input type="text" name="email" size="30"><br>
<form action="submit.htm" onSubmit="return validate_form(this)" method="post">
<input type="submit" value="Submit" >
</form>
</body>
|
|||||||