CodingForums.com - Alert Messages

CodingForums.com (http://www.codingforums.com/index.php)

- DOM and JSON scripting (http://www.codingforums.com/forumdisplay.php?f=15)

- - Alert Messages (http://www.codingforums.com/showthread.php?t=274262)

Hi there,

I am trying to make alert messages for when neither a flight nor seating preference has been made, and it's a struggle. Any help would be amazing.

Code:

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html;

charset=utf-8">

<title>gotham airlines</title>

<script>



function calculateCost() {



for (var i = 1; i < 7; i++) {

var radiobutton = document.getElementById("flight" + i);

if (radiobutton.checked == true) {

var base=radiobutton.value;

}

}

var rtn=document.getElementById("returnfare").checked?2:1;

for (var a = 1; a < 4; a++) {

var radiobutton = document.getElementById("seating" + a);

if (radiobutton.checked == true) {

var seatclass=radiobutton.value;

}

}

var cost=base*rtn*seatclass;

alert("The selected flight will cost $" + cost);

}



</script>

</head>

<body>

<h1>Gotham Airlines Fare Calculator</h1>

<form>

<p>Complete the form below to calculate the cost of your flight.</p>

Route:<br>

<p><input type="radio" id="flight1" name="flights"

value="230"> <label for="flight1">Gotham - Hill Valley</label><br>

<input type="radio" id="flight2" name="flights"

value="250"> <label for="flight2">Gotham - Las Venturas</label><br>

<input type="radio" id="flight3" name="flights"

value="190"> <label for="flight3">Gotham - Storybrooke</label><br>

<input type="radio" id="flight4" name="flights"

value="160"> <label for="flight4">Gotham - Marlinshire</label><br>

<input type="radio" id="flight5" name="flights"

value="270"> <label for="flight5">Gotham - Lillian</label><br>

<input type="radio" id="flight6" name="flights"

value="220"> <label for="flight6">Gotham - Seahaven</label></p>



<p><input type="checkbox" id="returnfare" name="return fare"

value="2"> <label for="returnfare">Click here if you will be purchasing a return fare</label></p>



Seating:<br>

<p><input type="radio" id="seating1" name="seating"

value="2"> <label for="seating1">First class</label><br>

<input type="radio" id="seating2" name="seating"

value="1.5"> <label for="seating2">Business class</label><br>

<input type="radio" id="seating3" name="seating"

value="1"> <label for="seating3">Economy class</label></p>

<p><input type="submit" value="Calculate"

onClick="calculateCost();"> <input type="reset"></p>

</form>

</body>

</html>

If you post any code please put it in between [CODE][/CODE] tags. It makes scanning your posts much easier. You can do this by clicking the small ‘#’ icon above the reply field.

You need to declare a variable and set it to 0 at the start, then add to it if a button is checked. If the variable still == 0, no buttons have been checked.

Code:

function calculateCost() { 

var totalChkd = 0; 

for (var i = 1; i < 7; i++) { 

var radiobutton = document.getElementById("flight" + i); 

if (radiobutton.checked == true) { 

var base=radiobutton.value; totalChkd++; 

} 

} 

var rtn=document.getElementById("returnfare").checked?2:1; 

for (var a = 1; a < 4; a++) { 

var radiobutton = document.getElementById("seating" + a); 

if (radiobutton.checked == true) { 

var seatclass=radiobutton.value; totalChkd++;  

} 

}

if(totalChkd < 2){ 

alert("Please select both flight and seat"); return false;

} 

var cost=base*rtn*seatclass; 

alert("The selected flight will cost $" + cost); 

}

Then change your submit button:

Code:

<input type="submit" value="Calculate" onClick="return calculateCost();">

Wow, thank you. I did all kinds of different things, none of which actually worked. Thank you heaps x

What is supposed to happen when the person clicks on the checkbox in the alert that turns off JavaScript?