EDIT - i copied the wrong code on the last post, sorrry. here is the revised post…
Hi i posted a week or so ago and got some great help here with my school project, now a friend needs help and im posting on behalf of her as i still am useless with Javascript. it is a calculator for a wallpaper site but when we enter the measurements, they disappear, do not display an answer, but do show an answer in the url?? Any help here would be greatfully appreciated
here is the code…
<body>
<div id="frame">
<div id="header">
<p class="title"><u>Amanda Davidson's Wallpaper World</u> - <u>Calculator In Meters</u></p>
</div>
<div id="interactiveheader">
<table width="455" class="linkstable" align="center">
<tr>
<td width="54" class="nav"><a href="HomePage.html"><img src="home.gif" alt="Home" style="border:0;"/></a></td>
<td width="67" class="nav"><a href="LogInPage.html">Log In</a></td>
<td width="110" class="nav"><a href="ColourSchemePage.html">Colour Scheme</a></td>
<td width="114" class="nav"><a href="NewCollectionPage.html">New Collection</a></td>
<td width="86" class="nav"><a href="CalculatorPage.html">Calculator</a></td>
</tr>
</table>
</div>
<div id="leftcontent">
<!--Images or content will appear here.-->
</div>
<div id="rightcontent">
<div id="main">
<p>
<!--Information content will be added here, this either being text on now to use the website or a brief introduction to the website.-->
Welcome to the Wallpaper Calculator this is the calculator for Metric measurements, enter in your measurements and calulcate the amount of rolls needed to wallpaper your room.</p>
<p>Allow 10% extra for pattern matching, based on the average pattern repeat. Please note the quantity shown is an estimate calculated on a standard room layout.</p>
<p>You may need to round up your measurements.</p>
<h4>Metric Calculator</h4>
<form name="metriccalculator">
<p>Determine the area to cover for each wall:</p>
<p>Wall 1: Length
<input type="text" size="10" height="15" name="number1a">
Height
<input type="text" size="10" height="15" name="number1b">
<br/>
Wall 2: Length
<input type="text" size="10" height="15" name="number2a">
Height
<input type="text" size="10" height="15" name="number2b">
<br/>
Wall 3: Length
<input type="text" size="10" height="15" name="number3a">
Height
<input type="text" size="10" height="15" name="number3b">
<br/>
Wall 4: Length
<input type="text" size="10" height="15" name="number4a">
Height
<input type="text" size="10" height="15" name="number4b">
<br/>
</p>
<p>Determine the area not to cover:</p>
<p>Door: Length
<input type="text" size="10" height="15" name="number5a">
Height
<input type="text" size="10" height="15" name="number5b">
<br/>
Window: Length
<input type="text" size="10" height="15" name="number6a">
Height
<input type="text" size="10" height="15" name="number6b">
<br />
Other: Length
<input type="text" size="10" height="15" name="number7a">
Height
<input type="text" size="10" height="15" name="number7b">
<br />
<br />
<input type="image" src="Images/CalculateButton.png" onclick="javascript:multiplymetric();" style="border:0;"/>
</p>
<p>Your Results:</p>
<p>Rolls needed:
<input type="text" size="15" height="15" name="total">
</p>
</form>
</div>
</div>
and here is the .js file
/* Here we have identified which input is being validated, via doment.forms 'myform', and called the element x and y using variables.
Establishing if the @ position is less than the 2nd along then it would be an incorrect email, and if the . position is closer
than 2nd to the end of the string, and if so returning an alert that the information is not correct. Also if the password does not equal
exactly to 123 then the information is again incorrect.*/
function validateForm(){
var x=document.forms["myForm"]["email"].value
var y= document.forms["myForm"]["password"].value;
var atpos=x.indexOf("@");
var dotpos=x.lastIndexOf(".");
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length){
alert("Not a valid e-mail address");
return false;
}
if (y == '') {
alert('Please enter your password.');
return false;
}
}
/*This function calculates the amount of rolls that the user will need to cover their room
Naming each one with a name and a letter (a, b, c etc) allows the equation to be imported into the website.
Adding a, c, e and g together to create the overall length and timesing it by (b+d+f+h) which is the height to then get to total of the room.
Subtracting it by the door space and window space that wallpaper is not needed for and then dividing it by 6.6 to gain how much roll is needed
per square metre.*/
function multiplymetric(){
a=Number(document.metriccalculator.number1a.value);
b=Number(document.metriccalculator.number1b.value);
c=Number(document.metriccalculator.number2a.value);
d=Number(document.metriccalculator.number2b.value);
e=Number(document.metriccalculator.number3a.value);
f=Number(document.metriccalculator.number3b.value);
g=Number(document.metriccalculator.number4a.value);
h=Number(document.metriccalculator.number4b.value);
i=Number(document.metriccalculator.number5a.value);
j=Number(document.metriccalculator.number5b.value);
k=Number(document.metriccalculator.number6a.value);
l=Number(document.metriccalculator.number6b.value);
m=Number(document.metriccalculator.number7a.value);
n=Number(document.metriccalculator.number7b.value);
o=(((a+c+e+g)*(b+d+f+h))-((i+k+m)*(j+l+n)))/6.6
document.metriccalculator.total.value=o;
}
/*This function calculates the amount of rolls that the user will need to cover their room
Naming each one with a name and a letter (a, b, c etc) allows the equation to be imported into the website.
Adding a, c, e and g together to create the overall length and timesing it by (b+d+f+h) which is the height to then get to total of the room.
Subtracting it by the door space and window space that wallpaper is not needed for and then dividing it by 74 to gain how much roll is needed
per square metre.*/
function multiplyimperial(){
a=Number(document.imperialcalculator.number1a.value);
b=Number(document.imperialcalculator.number1b.value);
c=Number(document.imperialcalculator.number2a.value);
d=Number(document.imperialcalculator.number2b.value);
e=Number(document.imperialcalculator.number3a.value);
f=Number(document.imperialcalculator.number3b.value);
g=Number(document.imperialcalculator.number4a.value);
h=Number(document.imperialcalculator.number4b.value);
i=Number(document.imperialcalculator.number5a.value);
j=Number(document.imperialcalculator.number5b.value);
k=Number(document.imperialcalculator.number6a.value);
l=Number(document.imperialcalculator.number6b.value);
m=Number(document.imperialcalculator.number7a.value);
n=Number(document.imperialcalculator.number7b.value);
o=(((a+c+e+g)*(b+d+f+h))-((i+k+m)*(j+l+n)))/74
document.imperialcalculator.total.value=o;
}
/*This function is for the colours of the website, arranged in an array and is called upon depending on what the user chooses. The array is numbered (0,1,2 etc) this will then be stated in the html pages as the user points the mouse over them. */
function changeBG(whichColor)
{
var backColor = new Array();
backColor[0] = '#8A8A8A';
backColor[1] = '#FF3333';
backColor[2] = '#FFCC00';
backColor[3] = '#0099FF';
backColor[4] = '#009900';
backColor[5] = '#FFFFFF';
document.bgColor = backColor[whichColor];
}
Many thanks for taking time and looking at this
Alan