Javascript Date Validation on Form Input - javascript

Am trying to validate the date on a form so that user cannot select a date in the past, or that checkout date is greater than checkin date
<form action="form2email.php" method="post" name="form" target="_blank" onSubmit="return validate(form);">
<fieldset id="user-1">
<h2>
<img src="images/booking-enquiry.png" width="160" height="20" />
</h2>
<label for="name">Name:</label>
<input name="name" type="text" />
<label for="email" class="required">Email:</label>
<input type="text" name="email" size="8" id="email" />
</fieldset>
<fieldset id="user-2">
<h2> </h2>
<label for="Phone" class="required">Phone:</label>
<input type="text" name="Telephone_Number" id="Phone" />
<label for="Accommodation Type" class="required">Accommodation Type:</label>
<select id="room_type" name="Accommodation Type">
<option value="Villa">Villa</option>
<option value="1 Bed Apartment">1 Bed Apartment</option>
<option value="2 Bed Apartment">2 Bed Apartment</option>
</select>
</fieldset>
<fieldset id="user-3">
<h2> </h2>
<label for="Check-in-Date" class="required">Check-in Date:</label>
<script>
DateInput('checkindate', true, 'DD-MON-YYYY')
</script>
<label for="Check-out-Date" class="required">Check-out Date:</label>
<script>
DateInput('checkoutdate', true, 'DD-MON-YYYY')
</script>
<label>
<div style="padding-top:10px;font-size:14px;color:white;">
<p>Total Charges: <span id="tot_charges">1995.00</span> THB
</p>
<p class="VAT"><span> Prices exclude VAT # 7%</span>
</p>
</div>
</label>
</fieldset>
<fieldset id="user-4">
<h2> </h2>
<label for="Comments" class="required">Comments :</label>
<textarea name="Comments"></textarea>
<div>
<label style="padding:0;">Please read our cancellation policy
</label>
<input type="checkbox" name="checkbox" id="checkbox" value="I agree to cancellation policy">
<label for="checkbox" id="agree" name="agree">I agree to cancellation policy</label>
</div>
<input type="submit" value="Submit" />
</fieldset>
</form>
<SCRIPT LANGUAGE="JavaScript">
function validate() {
var frm = document.forms["form"];
if (frm.checkbox.checked == false) {
alert("Please Agree To Our Cancellation Policy.");
return false;
} else return true;
}
</SCRIPT>
<script type="text/javascript">
var frmvalidator = new Validator("form");
frmvalidator.addValidation("Email", "maxlen=100");
frmvalidator.addValidation("Email", "req");
frmvalidator.addValidation("Email", "email");
frmvalidator.addValidation("Phone", "req");
frmvalidator.addValidation("Phone", "maxlen=100");
frmvalidator.addValidation("Phone", "numeric");
frmvalidator.setAddnlValidationFunction(validate);
</script>
Was trying to integrate something like this in :
function validateTheDate() {
var dateOK = false;
var Today = new Date();
if (Response_Requested_By_Object.picked.date < Today)
alert('Cannot select a date in the past.');
else if (Response_Requested_By_Object.picked.yearValue > 2020)
alert('Cannot select dates beyond 2020.');
else
dateOK = true;
return dateOK;
}
But not quite sure how to do it with existing validation there ?!?

This is how the validateDate function should look like:
function validateDate(){
var dateOK = false;
var today = new Date();
var startDt = new Date(document.getElementById("checkin").value).getTime();
var endDt = new Date(document.getElementById("checkout").value).getTime();
if (startDt < today || endDt < today)
alert('Cannot select a date in the past.');
else if (startDt > 2020 || endDt > 2020)
alert('Cannot select dates beyond 2020.');
else if(startDt > endDt){
alert ('Checkout date is greater than Checkin date.');
dateOK = true;
}
}
to add this custom function to you validator, just need to:
frmvalidator.setAddnlValidationFunction(validateDate);
Note: I'm sure there is a lot of (Javascript) Jquery plugins very good for validate forms and dates (using alert is not cool).

Related

Trying to update the poll count after each vote

I have a poll for my mock website where I need to vote for one of three contestants. I need to store the vote in local storage and then after each additional vote, I need to update the vote in local storage and display it beside the contestants. My main problem is with updating the vote in local storage. I have to do it with only javaScript, HTML and CSS
<html>
<body>
<fieldset>
<legend> <h3>Vote For Your Favorite Chef! </h3></legend>
<form onsubmit="getChoice()" id="pollForm"> <!-- do js for the getCHoice-->
<input type="radio" id="Nominee1" name="Nominee" value="Reynold Poernomo" required/>
<label for="Nominee1"> Reynold Poernomo </label>
<span id="nom1" class="vote"></span>
<br/>
<input type="radio" id="Nominee1.1" name="Nominee" value="Christine Tania" required>
<label for="Nominee1.1"> Christine Tania </label>
<span id="nom2" class="vote"></span>
<br/>
<input type="radio" id="Nominee1.2" name="Nominee" value="Christina Tosi" required>
<label for="Nominee1.2"> Christina Tosi </label>
<span id="nom3" class="vote"></span> <br />
<br/>
<input type="submit">
</form>
<script src="js/localStorage.js"></script>
</fieldset>
</body>
</html>
<script>
function incrementPoll() {
let nominee1 = document.getElementById('Nominee1').value;
let nominee2 = document.getElementById('Nominee2').value;
let nominee3 = document.getElementById('Nominee3').value;
if (nominee1.checked == true) {
updatePoll("Nominee1");
} else if (nominee2.checked == true) {
updatePoll("Nominee2");
} else if (nominee3.checked == true) {
updatePoll("Nominee3");
}
}
function updatePoll(entry) {
let voteUpdate = parseInt(localStorage.getItem(entry),10) + 1;
return localStorage.setItem(entry, (Number(voteUpdate)).toString()); //how to convert to string
}
These two functions are supposed to check which button is being selected and updates the vote in local storage. But it doesn't actually work.
Here's a working version of your code. I hope this helps.
const nominee1 = document.getElementById('Nominee1');
const nominee2 = document.getElementById('Nominee2');
const nominee3 = document.getElementById('Nominee3');
function incrementPoll(e) {
e.preventDefault();
if (nominee1.checked == true) {
updatePoll("Nominee1");
} else if (nominee2.checked == true) {
updatePoll("Nominee2");
} else if (nominee3.checked == true) {
updatePoll("Nominee3");
}
}
function updatePoll(entry) {
const voteUpdate = (parseInt(localStorage.getItem(entry), 10) || 0) + 1;
localStorage.setItem(entry, voteUpdate);
document.querySelector(`#${entry.replace('Nominee', 'nom')}`).innerText = voteUpdate;
}
<fieldset>
<legend>
<h3>Vote For Your Favorite Chef! </h3>
</legend>
<form onsubmit="incrementPoll(event)" id="pollForm">
<input type="radio" id="Nominee1" name="Nominee" value="Reynold Poernomo" required/>
<label for="Nominee1"> Reynold Poernomo </label>
<span id="nom1" class="vote"></span>
<br/>
<input type="radio" id="Nominee2" name="Nominee" value="Christine Tania" required>
<label for="Nominee1.1"> Christine Tania </label>
<span id="nom2" class="vote"></span>
<br/>
<input type="radio" id="Nominee3" name="Nominee" value="Christina Tosi" required>
<label for="Nominee2"> Christina Tosi </label>
<span id="nom3" class="vote"></span> <br />
<br/>
<input type="submit">
</form>
</fieldset>
Since the snippet won't work because localStorage is not accessible in an SO snippet, here is a fiddle

cant seem to get Javascript connecting or working

I am currently doing a unit task and am having trouble working out why my javascript wont connect. i have tried a few things but cant seem to work it out. Im sure its easy but i just cant work it out. an explanation would be great too.
There are two files one html and one javascript.
Thanks in advance
HTML
<script src="validate.js"></script>
</head>
<body>
<header>
<h1>Rohirrim Ranch Tours</h1>
<h2>Booking Form</h2>
</header>
<form id="regform" method="post"
action="https://mercury.swin.edu.au/it000000/formtest.php"
novalidate="novalidate">
<fieldset id="person">
<legend>Your details:</legend>
<p><label for="firstname">Enter your first name</label>
<input type="text" name="firstname" id="firstname" size="20"
/>
</p>
<p><label for="lastname">Enter your last name</label>
<input type="text" name="lastname" id="lastname" size="20" />
</p>
<fieldset id="species">
<legend>Species:</legend>
<label for="human">Human</label>
<input type="radio" name="species" id="human"
value="Human"/><br />
<label for="dwarf">Dwarf</label>
<input type="radio" name="species" id="dwarf"
value="Dwarf" /><br />
<label for="elf">Elf</label>
<input type="radio" name="species" id="elf"
value="Elf" /><br />
<label for="hobbit">Hobbit</label>
<input type="radio" name="species" id="hobbit"
value="Hobbit" /><br />
</fieldset>
<p><label for="age">Enter your age</label>
<input type="text" id="age" name="age" size="5">
</p>
<p><label for="beard">Enter your beard length in inches</label><br />
0 <input type="range" id="beard" name="beard" min="0"
max="60"> 60
</p>
</fieldset>
<fieldset id="trip">
<legend>Your trip:</legend>
<fieldset>
<legend>Booking:</legend>
<label for="1day">1 Day Tour - $200 </label>
<input type="checkbox" name="1day" id="1day"
value="1day" /><br />
<label for="4day">4 Day Tour - $1500</label>
<input type="checkbox" name="4day" id="4day"
value="4day" /><br />
<label for="10day">10 Day Tour - $3000</label>
<input type="checkbox" name="10day" id="10day"
value="10day" /><br />
</fieldset>
<p>
<label for="food">Menu preferences</label>
<select name="food" id="food">
<option value="none">Please select</option>
<option value="lembas">Lembas</option>
<option value="mushrooms">Mushrooms</option>
<option value="ent">Ent Draft</option>
<option value="cram">Cram</option>
</select>
</p>
<p>
<label for="partySize">Number of Travellers</label>
<input type="text" id="partySize" name="partySize"
maxlength="3" size="3" />
</p>
</fieldset>
<div id="bottom"> </div>
<p><input type="submit" value="Book Now!" />
<input type="reset" value="Reset" />
</p>
</form>
JAVASCRIPT
"use strict";
function validate() {
var firstname = document.getElementById("firstname").value;
var lastname = document.getElementById("lastname").value;
var errMsg = "";
var result = true;
if (!firstname.match(/^[a-zA-Z]+$/)) {
errMsg = errMsg + "Your first name must only contain alpha
characters\n";
result = false; }
if (!lastname.match(/^[a-zA-Z+$]/)){
errMsg = errMsg + "Your last name must only contain alpha
characters\n";
result = false;
}
var age = document.getElementById("age").value;
if (isNaN(age)){
errMsg = errMsg + "your age must be a number\n"
result = false;
}
else if (age < 18) {
errMsg = errMsg +" your age must be 18 or older\n";
result = false;
}
else if (age >= 10000) {
errMsg = errMsg + "your age must be between 18 and 10000\n";
result = false;
}
var partySize = document.getElementById("partySize").value;
if (isNaN(partySize)) {
errMsg = errMsg + "your age must be a number\n"
result = false;
}
else if (partySize < 1) {
errMsg = errMsg +" party size must be greater than 0\n";
result = false;
}
else if (age >= 100) {
errMsg = errMsg + "your party size must be less or equal to 100\n";
result = false;
}
if (erMsg !== ""){
alert(errMsg);
}
return result;
}
function init() {
var regForm = document.getElementById("regform");
regForm.onsubmit = validate;
}
window.onload = init;
I see your error erMsg instead of errMsg
if (erMsg !== ""){
alert(errMsg);
}
and also add event.preventDefault(); at the beginning of the validate function
Your js reference is fine :)
Try setting the Javascript url as './validate.js'

JavaScript validating datetime-local from form

I have an html form which allows for a taxi booking, but it shouldn't allow bookings back in time! so the time must be current or in the future.
Here is the form, I use datetime-local.
/* Here is the JavaScript validation for the datetime-local. */
var dateTime = document.getElementById("dateTime").value;
if (dateTime == "" || dateTime == null) {
booking.dateTime.focus();
document.getElementById("dateMessage").innerHTML = "Please select a date AND time, thankyou.";
return valid = false;
} else {
document.getElementById("destinationMessage").innerHTML = "";
}
```
<form id="booking" action="">
<div id="firstNameMessage" class="red"></div>
<span class="red">*</span>First Name:
<input type="text" name="firstName" id="firstName">
<br>
<div id="lastNameMessage" class="red"></div>
<span class="red">*</span>Last Name:
<input type="text" name="lastName" id="lastName">
<br>
<div id="numberMessage" class="red"></div>
<span class="red">*</span>Contact Number:
<input type="text" name="number" id="number">
<br>
<div id="unitMessage" class="red"></div>
Unit Number(optional):
<input type="text" name="unit" id="unit">
<br>
<div id="streetNumberMessage" class="red"></div>
<span class="red">*</span>Street Number:
<input type="text" name="streetNumber" id="streetNumber">
<br>
<div id="streetNameMessage" class="red"></div>
<span class="red">*</span>Street Name:
<input type="text" name="streetName" id="streetName">
<br>
<div id="pickupMessage" class="red"></div>
<span class="red">*</span>Suburb:
<input type="text" name="pickupSuburb" id="pickupSuburb">
<br>
<div id="destinationMessage" class="red"></div>
Destination Suburb<span class="red">*</span>:
<input type="text" name="destinationSuburb" id="destinationSuburb">
<br>
<div id="dateMessage" class="red"></div>
Pick-Up Date and Time<span class="red">*</span>:
<input type="datetime-local" name="dateTime" id="dateTime">
<br>
<br>
<input type="button" value="Submit"
onclick="getData('bookingprocess.php','message', firstName.value, lastName.value, number.value, unit.value, streetNumber.value, streetName.value, pickupSuburb.value, destinationSuburb.value, dateTime.value)" />
<input type="reset" value="Reset">
</form>
How can I make it check for being the current time or in the future? (Basically disabling past entries).
Please use input type = "date" instead of date-time. Probably no more supported by browsers.
Please refer this link
Now to set min date you cn use the following snippet
//Get today's date and split it by "T"
var today = new Date().toISOString().split('T')[0];
document.getElementById("dateTime").setAttribute('min', today);
DEMO
You can just compare dates by > and <. Make sure the dates in the same timezone though.
var dateTimeStr = document.getElementById("dateTime").value;
var dateTime = convertDateToUTC(new Date(dateTimeStr));
var now = new Date();
if (isNaN(date.getTime()) || date <= now) {
booking.dateTime.focus();
document.getElementById("dateMessage").innerHTML = "Please select a date AND time in the future, thankyou.";
return valid = false;
} else {
document.getElementById("destinationMessage").innerHTML = "";
}
function convertDateToUTC(date) {
return new Date(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate(), date.getUTCHours(), date.getUTCMinutes(), date.getUTCSeconds());
}
JS Fiddle
You should use a jquery or bootstrap calendar. It is ideal for this situation. It is also very easy for the user to pick up the date this way.
You have all configuration options in such calendars for e.g. assigning culture, date format, mindate, maxdate etc.
Also keep in mind to pick the date from server and set it as mindate in javascript since the datetime might be wrong on client computer.

Using DOM to create an input

I currently have been working on this code and I can't seem to figure it out. I am planning to make it so that if the radio button is pressed that shipping is not free, that an input field pops up to specifying what the addition cost will be using DOM. I am also trying to figure out how to add text to describe the input field, and to validate the input field.
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<script>
function myFunction() {
var x = document.createElement("INPUT");
var c = 1;
if (c = 1) {
x.setAttribute("type", "text");
var sp2 = document.getElementById("emailP");
// var br = document.createElement("br");
// sp2.appendChild(br);
// alert("added break");
var sp2 = document.getElementById("emailP");
var parentDiv = sp2.parentNode;
parentDiv.insertBefore(x, sp2);
c++;
alert("Added Text Box");
}
}
</script>
<form action="#" method="post" onsubmit="alert('Your form has been submitted.'); return false;">
<p class="boldParagraph">Upload an Image:</p>
<input type="file" id="pic" accept="image/*" required>
<p class="boldParagraph">Name of seller:</p>
<input class="averageTextBox" type="text" id="seller" value="" required>
<p class="boldParagraph" id = "tip3P">Shipping costs are free:</p>
<input type="radio" name="tip3" value="3" checked /> Yes
<input type="radio" name="tip3" value="4" onclick="myFunction(); this.onclick=null;"/> No
<p class="boldParagraph" id = "emailP">Email of seller:</p>
<input class="averageTextBox" type="email" id="emailAddress" value="" required>
<p class="boldParagraph">Closing date for auction:</p>
<input type="date" id="closeDate" value="" required>
<br><br>
<button>Submit</button>
</form>
</body>
</html>
Create a label element and populate text using innerHTML. and then append to DOM.
Example Snippet:
function myFunction() {
var label = document.createElement("label");
label.innerHTML = "<br>Shipment Cost : ";
var x = document.createElement("INPUT");
var c = 1;
if (c = 1) {
x.setAttribute("type", "text");
var sp2 = document.getElementById("emailP");
// var br = document.createElement("br");
// sp2.appendChild(br);
// alert("added break");
var sp2 = document.getElementById("emailP");
var parentDiv = sp2.parentNode;
parentDiv.insertBefore(x, sp2);
parentDiv.insertBefore(label, x);
c++;
alert("Added Text Box");
}
}
<form action="#" method="post" onsubmit="alert('Your form has been submitted.'); return false;">
<p class="boldParagraph">Upload an Image:</p>
<input type="file" id="pic" accept="image/*" required>
<p class="boldParagraph">Name of seller:</p>
<input class="averageTextBox" type="text" id="seller" value="" required>
<p class="boldParagraph" id="tip3P">Shipping costs are free:</p>
<input type="radio" name="tip3" value="3" checked />Yes
<input type="radio" name="tip3" value="4" onclick="myFunction(); this.onclick=null;" />No
<p class="boldParagraph" id="emailP">Email of seller:</p>
<input class="averageTextBox" type="email" id="emailAddress" value="" required>
<p class="boldParagraph">Closing date for auction:</p>
<input type="date" id="closeDate" value="" required>
<br>
<br>
<button>Submit</button>
</form>
OR
You can keep the text box hidden and show it when user clicks no. Also, apply validations only when no is selected for shipment radio button.
I suggest use jQuery, see the snippet below:
jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers. With a combination of versatility and extensibility, jQuery has changed the way that millions of people write JavaScript.
var radioButtons = $("[name=tip3]");
radioButtons.on("change", function() {
if ($("[name=tip3]:checked").val() == "3") {
$("#shipmentDetail").hide();
} else {
$("#shipmentDetail").show();
}
})
$("#submit").on("click", function() {
var flag = true;
if ($("[name=tip3]:checked").val() == "4") {
if ($("#shipmentDetail").val() == "") {
flag = false;
alert("enter some value");
}
}
//other validations here
if (flag) {
$("#form").submit()
}
})
#shipmentDetail {
display: none
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="form" action="#" method="post">
<p class="boldParagraph">Upload an Image:</p>
<input type="file" id="pic" accept="image/*" required>
<p class="boldParagraph">Name of seller:</p>
<input class="averageTextBox" type="text" id="seller" value="" required>
<p class="boldParagraph" id="tip3P">Shipping costs are free:</p>
<input type="radio" name="tip3" value="3" checked />Yes
<input type="radio" name="tip3" value="4" />No
<label id="shipmentDetail" for="price">Shipment Cost:
<input id="price" type="text" value="" />
</label>
<p class="boldParagraph" id="emailP">Email of seller:</p>
<input class="averageTextBox" type="email" id="emailAddress" value="" required>
<p class="boldParagraph">Closing date for auction:</p>
<input type="date" id="closeDate" value="" required>
<br>
<br>
<button id="submit">Submit</button>
</form>
replace
alert("Added Text Box");
with:
var additional_fees = prompt("Type in");
x.setAttribute("value", additional_fees)

how to use javascript function in a form button?

I don't know anything about html and most especially javascript.. but we have this activity on how you'll call the javascript function that is located at the <head></head> of the html tag?
And what if there are several functions? Can I call it at the same time in one button? or should I create another function and put all the functions in there?
This is what our activity is all about... in a javascript button, when clicked, it must calculate all transactions? I have 5 functions, and one of them is called by a button tag, while the other 4 are inside of that function. I don't really know what to do... But when I clicked the button, nothing will happen. Btw, it's a Reservation form, so when the button is clicked, it must calculate all the inputs and shows a confirmation page/alert with the prices and such. Thanks guys!
This is my code of the form:
<form name="reserve" action="" id="reserve" method="post">
<fieldset>
<legend>Contact Information</legend>
<label for="name">Name: </label>
<input type="text" name="firstname" value="firstname"
onfocus="if (this.value==this.defaultValue)this.value='';"
onblur="if(this.value=='')this.value=this.defaultValue;"/>
<input type="text" name="lastname" value="lastname"
onfocus="if(this.value==this.defaultValue)this.value='';"
onblur="if(this.value=='')this.value=this.defaultValue;"/>
<br>
<label for="address">Address: </label>
<textarea name="address" cols="30" rows="3"></textarea>
<br>
<label for="city">City: </label>
<input type="text" name="city">
<label for="country">Country: </label>
<select name="country">
<option value=""></option>
<option value="PH">Philippines</option>
<option value="TH">Thailand</option>
<option value="VN">Vietnam</option>
<option value="MY">Malaysia</option>
<option value="ID">Indonesia</option>
<option value="SG">Singapore</option>
</select>
<br>
<label for="email">Email: </label>
<input type="email" name="email">
<label for="phone">Phone: </label>
<input type="tel" name="phone">
</fieldset>
<hr>
<fieldset>
<legend>Accomodation Request</legend>
<label for="checkin">Check-in: </label>
<input type="date" name="checkin">
<label for="checkout">Check-out: </label>
<input type="date" name="checkout">
<br>
<label for="roomtype">Room type: </label> <br>
<input type="checkbox" id="s" name="roomtype" value="superior">Superior |||||
<label for="sguest">No.of guests: </label>
<input type="text" id="supg" name="sguest" size="3"> <br>
<input type="checkbox" id="d" name="roomtype" value=deluxe">Deluxe |||||||
<label for="dguest">No.of guests: </label>
<input type="text" id="delg" name="dguest" size="3"> <br>
<input type="checkbox" id="p" name="roomtype" value="Premier">Premier |||||
<label for="pguest">No.of guests: </label>
<input type="text" id="premg" name="pguest" size="3"> <br>
</fieldset>
<br>
<hr>
<label for="adinfo">Additional Information:</label>
<textarea name="adinfo" cols="40" rows="10"></textarea>
<br><br>
<hr>
<input type="button" name="submit" onclick="formSubmit()"
class="submit" value="Reserve">
</form>
And this is javascript code:
function superiorroom(){
var roomprice=0;
var theForm = document.forms["reserve"]
var s = theForm.elements["s"]
var supg = theForm.elements["supg"]
var t=0;
If (s.checked==true)
{
roomprice=5400;
squantity=parseInt(squantity.value);
t=parseInt(t);
t= (roomprice*squantity)*supg;
}
return t;
}
function deluxeroom(){
var roomprice=0;
var theForm = document.forms["reserve"]
var d = theForm.elements["d"]
var delg = theForm.elements["delg"]
var u=0;
If (d.checked==true)
{
roomprice=7200;
dquantity=parseInt(dquantity.value);
u=parseInt(u);
u= (roomprice*dquantity)*delg;
}
return u;
}
function premiumroom(){
var roomprice=0;
var theForm = document.forms["reserve"]
var p = theForm.elements["p"]
var premg = theForm.elements["premg"]
var v=0;
If (p.checked==true)
{
roomprice=9800;
pquantity=parseInt(pquantity.value);
v=parseInt(v);
v= (roomprice*pquantity)*premg;
}
return u;
}
</script>
I hope you can help me guys!
Hi I have change your code a little check it
<input type="button" name="submit" onclick="return formSubmit()" class="submit" value="Reserve">
I changed your code as like this : Try This
Button
<input type="button" id="submit" name="submit" onclick="return formSubmit()" class="submit" value="Reserve">
Scripts
<script>
$("#submit").click(function () {
if ( document.getElementById("s").checked =checked)
superiorroom();
else if(document.getElementById("d").checked =checked)
deluxeroom();
else if(document.getElementById("p").checked =checked)
premiumroom();
});
</script>
<script>
function superiorroom(){
var roomprice=0;
var theForm = document.forms["reserve"]
var s = theForm.elements["s"]
var supg = theForm.elements["supg"]
var t=0;
If (s.checked==true)
{
roomprice=5400;
squantity=parseInt(squantity.value);
t=parseInt(t);
t= (roomprice*squantity)*supg;
}
return t;
}
function deluxeroom(){
var roomprice=0;
var theForm = document.forms["reserve"]
var d = theForm.elements["d"]
var delg = theForm.elements["delg"]
var u=0;
If (d.checked==true)
{
roomprice=7200;
dquantity=parseInt(dquantity.value);
u=parseInt(u);
u= (roomprice*dquantity)*delg;
}
return u;
}
function premiumroom(){
var roomprice=0;
var theForm = document.forms["reserve"]
var p = theForm.elements["p"]
var premg = theForm.elements["premg"]
var v=0;
If (p.checked==true)
{
roomprice=9800;
pquantity=parseInt(pquantity.value);
v=parseInt(v);
v= (roomprice*pquantity)*premg;
}
return u;
}
</script>

Categories