/    Sign up×
Community /Pin to ProfileBookmark

Java script form

Copy linkTweet thisAlerts:
May 21.2015

Hi Guys,

Plz plz plz I need your help…
Is the below java script and form are right !!!
Also in this case when some one press submit should it sent to my e-mail address or what?
Last thing how to show a window to confirm that the form had been sent.
Thanks,

Rehab

<head>
<script language=”javascript”>
function calculate(form)
{
var item1 = form.item1.value;
var item2 = form.item2.value;
var item3 = form.item3.value;
var item4 = form.item4.value;
var item5 = form.item5.value;
var item6 = form.item6.value;
var item7 = form.item7.value;
var item8 = form.item8.value;
var total = form.total.value;
form.item2.value = (parseInt(item1) * 200);
form.item4.value = (parseInt(item3) * 200);
form.item6.value = (parseInt(item5) * 100);
form.item8.value = (parseInt(item7) * 50);

form.total.value = (parseInt(form.item2.value) +
parseInt(form.item4.value) + parseInt(form.item6.value) + parseInt(form.item8.value));
}
</script>
</head>

<body>
<table width=”780″ class=”table”>
<tr>
<td height=”31″ colspan=”2″ align=”center” bgcolor=”#CCCCCC”><p>RESERVATION FORM</p></td>
</tr>
<tr>
<td height=”10″ align=”right”>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td height=”35″ colspan=”2″ align=”center” valign=”middle”><p>a) Personal Information</p></td>
</tr>
<tr>
<td width=”381″ height=”35″ align=”right”><strong><span class=”ref”><strong>*</strong></span><strong></strong> Gender:</strong></td>
<td width=”381″><form action=”mailto:[email protected]” method=”post” enctype=”multipart/form-data” name=”form2″ target=”_self”>
<label for=”select3″></label>
<select name=”select” id=”select3″>
<option>Dr.</option>
<option>Mr.</option>
<option>Mrs.</option>
<option>Ms.</option>
</select>
</form></td>
</tr>
<tr>
<td height=”35″ align=”right”><span class=”ref”><strong>*</strong></span><strong> Name:</strong></td>
<td><label for=”name”></label>
<input type=”text” name=”name” id=”name”></td>
</tr>
<tr>
<td height=”35″ align=”right”><strong><span class=”ref”><strong>*</strong></span><strong></strong> E-mail:</strong></td>
<td><form name=”form1″ method=”post” action=””>
<label for=”textfield4″></label>
<input name=”textfield” type=”email” id=”textfield4″>
</form></td>
</tr>
<tr>
<td height=”35″ align=”right”><strong><span class=”ref”><strong>*</strong></span><strong></strong> Telephone:</strong></td>
<td><form name=”form3″ method=”post” action=””>
<label for=”textfield5″></label>
<input type=”text” name=”textfield2″ id=”textfield5″>
</form></td>
</tr>
<tr>
<td height=”20″>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>
<form method=”POST” action=”–WEBBOT-SELF–“>
<table class=”table2″s>
<tr>
<td align=”center”>&nbsp;</td>
<td align=”center”>&nbsp;</td>
<td align=”center”>&nbsp;</td>
</tr>
<tr>
<td colspan=”3″ align=”center”><p>b) Reservation Details</p></td>
</tr>
<tr>
<td width=”209″ height=”40″ align=”center”><strong>No of rooms</strong></td>
<td width=”271″ height=”40″ align=”center”><strong>Price Per Room</strong></td>
<td width=”278″ height=”40″ align=”center”><strong>Total</strong></td>
</tr>
<tr>
<td width=”209″ height=”40″ align=”center” valign=”middle”><select name=”item1″ id=”item1″ onChange=”calculate(this.form)” />
<option value=”s”></option>
<option value=”0″>0</option>
<option value=”1″>1</option>
<option value=”2″>2</option>
<option value=”3″>3</option>
<option value=”4″>4</option>
<option value=”5″>5</option>
<option value=”6″>6</option>
<option value=”7″>7</option>
<option value=”8″>8</option>
</td>
<td width=”271″ height=”40″ align=”left” valign=”middle”>Price per <strong class=”ref”>Double</strong> room <br>
<strong>$ 695</strong> X 02 persons: <strong class=”ref”>$ 200</strong></td>
<td width=”278″ height=”40″ align=”center” valign=”middle”>$
<input name=”item2″ type=”text” size=”20″ readonly></td>
</tr>
<tr>
<td width=”209″ height=”40″ align=”center” valign=”middle”>
<select name=”item3″ id=”item3″ onChange=”calculate(this.form)” />

<option value=”0″>0</option>
<option value=”1″>1</option>
<option value=”2″>2</option>
<option value=”3″>3</option>
<option value=”4″>4</option>
<option value=”5″>5</option>
<option value=”6″>6</option>
<option value=”7″>7</option>
<option value=”8″>8</option>
</td>
<td width=”271″ height=”40″ align=”left” valign=”middle”>Price per <span class=”ref”><strong>Triple</strong></span> room <br>
<strong>$ 695</strong> X 03 persons: <strong class=”ref”>$ 200</strong></td>
<td width=”278″ height=”40″ align=”center” valign=”middle”>$
<input name=”item4″ type=”text” size=”20″ readonly></td>
</tr>
<tr>
<td width=”209″ height=”40″ align=”center” valign=”middle”><select name=”item5″ id=”item5″ onChange=”calculate(this.form)” />
<option value=”0″>0</option>
<option value=”1″>1</option>
<option value=”2″>2</option>
<option value=”3″>3</option>
<option value=”4″>4</option>
<option value=”5″>5</option>
<option value=”6″>6</option>
<option value=”7″>7</option>
<option value=”8″>8</option>
</td>
<td width=”271″ height=”40″ align=”left” valign=”middle”>Price per <strong><span class=”ref”>Single</span></strong> room <br>
<strong>$ 945</strong> X 01 person: <strong class=”ref”>$ 100</strong></td>
<td width=”278″ height=”40″ align=”center” valign=”middle”>$
<input name=”item6″ type=”text” size=”20″ readonly></td>
</tr>
<tr>
<td width=”209″ height=”40″ align=”center” valign=”middle”><select name=”item7″ id=”item7″ onChange=”calculate(this.form)” />
<option value=”0″>0</option>
<option value=”1″>1</option>
<option value=”2″>2</option>
<option value=”3″>3</option>
<option value=”4″>4</option>
<option value=”5″>5</option>
<option value=”6″>6</option>
<option value=”7″>7</option>
<option value=”8″>8</option>
</td>
<td width=”271″ height=”40″ align=”left” valign=”middle”>Price per <strong><span class=”ref”>Child</span></strong> sharing parents’ room <br>
<strong>$ 350 </strong>X 01 person: <strong class=”ref”>$ 50</strong></td>
<td width=”278″ height=”40″ align=”center” valign=”middle”>$
<input name=”item8″ type=”text” size=”20″ readonly></td>
</tr>
<tr>
<td width=”209″ height=”40″ align=”center” valign=”middle”> </td>
<td width=”271″ height=”40″ align=”center” valign=”middle”><strong class=”ref”><span class=”fltlft”>TOTAL COST</span></strong></td>
<td width=”278″ height=”40″ align=”center” valign=”middle”> $
<input name=”total” type=”number” size=”20″ readonly></td>
</tr>
</table>
<p>
<input type=”submit” value=”Submit” name=”B1″>
<input type=”reset” value=”Reset” name=”B2″></p>
</form></body>

to post a comment
JavaScript

6 Comments(s) ↴

Copy linkTweet thisAlerts:
@nap0leonMay 22.2015 — A few things...

1- You have several forms instead of just one. I can't imagine a good reason for this and expect it is a rookie mistake. You probably want just one form.

2- You don't post a form to your email address unless you are relying on the user having an email program installed and configured on their machine (e.g., opening Outlook Express or similar). You probably want to submit the data to a webpage and have that webpage send the email. The HTML of that webpage would contain the "Thank You for submitting you email" message.
Copy linkTweet thisAlerts:
@srehabsauthorMay 23.2015 — Thank you so much for your reply.

1- Yes i want one form only but when i did that so many mistakes appeared.

2- Please help me as I'm new in this field ?

Now when end user select booking this and i want this booking data he did (number of rooms ...etc) to be delivered

to us in order to act accordingly.


How it will reach me please advise also how to appear this (THANK YOU window ).

Thanks again

Rehab
Copy linkTweet thisAlerts:
@srehabsauthorMay 24.2015 — OK I tried to solve mistakes you mentioned, please check it:

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<title>temp</title>

<script language="javascript">

function calculate(form)

{

var item1 = form.item1.value;

var item2 = form.item2.value;

var item3 = form.item3.value;

var item4 = form.item4.value;

var item5 = form.item5.value;

var item6 = form.item6.value;

var item7 = form.item7.value;

var item8 = form.item8.value;

var total = form.total.value;

form.item2.value = (parseInt(item1) * 1790);

form.item4.value = (parseInt(item3) * 2649);

form.item6.value = (parseInt(item5) * 1145);

form.item8.value = (parseInt(item7) * 450);

form.total.value = (parseInt(form.item2.value) +

parseInt(form.item4.value) + parseInt(form.item6.value) + parseInt(form.item8.value));

}

</script>

</head>

<body>

<form method="POST" action="--WEBBOT-SELF--">

<table border="1" cellspacing="1" width="757">

<tr>

<td colspan="3" align="center">RESERVATION FORM</td>

</tr>

<tr>

<td colspan="2" align="center">&nbsp;</td>

<td align="center">&nbsp;</td>

</tr>

<tr>

<td colspan="2" align="right">Gender:</td>

<td align="left"><label for="Gender"></label>

<select name="Gender" id="Gender">

<option>Dr.</option>

<option>Mr.</option>

<option>Mrs.</option>

<option>Ms.</option>

</select></td>

</tr>

<tr>

<td colspan="2" align="right">Name:</td>

<td align="left"><label for="name"></label>

<input type="text" name="name" id="name"></td>

</tr>

<tr>

<td colspan="2" align="right">E-mail:</td>

<td align="left"><label for="email"></label>

<input type="text" name="email" id="email"></td>

</tr>

<tr>

<td colspan="2" align="right">Telephone Number:</td>

<td align="left"><label for="tel"></label>

<input type="text" name="tel" id="tel"></td>

</tr>

<tr>

<td colspan="3" align="center">&nbsp;</td>

</tr>

<tr>

<td align="center">&nbsp;</td>

<td align="center">&nbsp;</td>

<td align="center">&nbsp;</td>

</tr>

<tr>

<td align="center">&nbsp;</td>

<td align="center">&nbsp;</td>

<td align="center">&nbsp;</td>

</tr>

<tr>

<td width="224" align="center"><strong>Number of rooms</strong></td>

<td width="39" align="center"><strong>Price Per Room</strong></td>

<td width="476" align="center"><strong>Total</strong></td>

</tr>

<tr>

<td width="224">Double rooms

<select name="item1" id="item1" onChange="calculate(this.form)" />

<option value="s"></option>

<option value="0">0</option>

<option value="1">1</option>

<option value="2">2</option>

<option value="3">3</option>

<option value="4">4</option>

<option value="5">5</option>

<option value="6">6</option>

<option value="7">7</option>

<option value="8">8</option>

</td>

<td width="39">$1790</td>

<td width="476"><input name="item2" type="text" size="20" readonly></td>

</tr>

<tr>

<td width="224">Triple rooms

<select name="item3" id="item3" onChange="calculate(this.form)" />

<option value="0">0</option>

<option value="1">1</option>

<option value="2">2</option>

<option value="3">3</option>

<option value="4">4</option>

<option value="5">5</option>

<option value="6">6</option>

<option value="7">7</option>

<option value="8">8</option> </td>

<td width="39">$2649</td>

<td width="476"><input name="item4" type="text" size="20" readonly></td>

</tr>

<tr>

<td width="224">Single rooms

<select name="item5" id="item5" onChange="calculate(this.form)" />

<option value="0">0</option>

<option value="1">1</option>

<option value="2">2</option>

<option value="3">3</option>

<option value="4">4</option>

<option value="5">5</option>

<option value="6">6</option>

<option value="7">7</option>

<option value="8">8</option>

</td>

<td width="39">$1145</td>

<td width="476"><input name="item6" type="text" size="20" readonly></td>

</tr>

<tr>

<td>&nbsp;</td>

<td>&nbsp;</td>

<td>&nbsp;</td>

</tr>

<tr>

<td><strong>Number of Children</strong></td>

<td><strong>Price Per Child</strong></td>

<td><strong>Total</strong></td>

</tr>

<tr>

<td width="224">Children

<select name="item7" id="item7" onChange="calculate(this.form)" />

<option value="0">0</option>

<option value="1">1</option>

<option value="2">2</option>

<option value="3">3</option>

<option value="4">4</option>

<option value="5">5</option>

<option value="6">6</option>

<option value="7">7</option>

<option value="8">8</option> </td>

<td width="39">$450</td>

<td width="476"><input name="item8" type="text" size="20" readonly></td>

</tr>

<tr>

<td width="224"> </td>

<td width="39">total</td>

<td width="476"> <input name="total" type="text" size="20" readonly></td>

</tr>

</table>

<p>

<input type="submit" value="Submit" name="B1">

<input type="reset" value="Reset"

name="B2"></p>

</form>

</body>

</html>
Copy linkTweet thisAlerts:
@srehabsauthorMay 24.2015 — If it's OK that's great ?

One more thing I do not want to see NaN on the form, if the end user did not start select number of rooms from double room it will show NaN.

Any ideas how to solve this.

Thanks sooooooooo much
Copy linkTweet thisAlerts:
@Kevin2May 24.2015 — If it's OK that's great ?

One more thing I do not want to see NaN on the form, if the end user did not start select number of rooms from double room it will show NaN.

Any ideas how to solve this.[/QUOTE]

[code=html]<option value="s"></option>[/code]
"s" is [B][I][COLOR="#FF0000"]N[/COLOR][/I][/B]ot [B][I][COLOR="#FF0000"]a[/COLOR][/I][/B] [B][I][COLOR="#FF0000"]N[/COLOR][/I][/B]umber
Copy linkTweet thisAlerts:
@ThegreatoneMay 24.2015 — PHP + AJAX is the better option in this kind of situations ?
×

Success!

Help @srehabs spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.16,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...