Javascript calculator help with coding

[Cat2008]

I would be grateful if someone could help me with some coding as I am quite a newbie when it comes to Javascript although I am learning.

I have some coding which produces a specific caluclator.

You enter numeric, length, width and height values and specifiy whether these measurements are in cm's or in inches. I have defined a formula with set parameters so that depending on what you enter, the caluclator with return a statement saying whether your item will fit into the box for example.

I have also made the boxes where you enter the values, turn red or green so that they visually indicate whther the item is too big / or will fit into the box.

There is one final piece of functionality I want to add. Under the 'Calculate - will it fit box' I want to add another function so that it tells you/calculates how many boxes yoou will require in total.

You will need to enter additional values for the 'total' VOLUME which would be Length, Width, Height and specify alike before whether the measurements are cm or in inches.

The formula I want to use is:-

total volume of object / 2.472cu.ft or 0.07 cu.m

You would then hit a button and the answer would be something along the lines of Approx Number of boxes required are ??? - the number would be presented here.

My current coding for the first part of the calculator as it stands is as follows:-

Grateful for any help!!!!!

Code: Select all

 <form name = "myform">
<p>Enter the length of your object: - <input type = "text" name = "lgth" size = "3" maxlength = "3" onKeyUp="checkNumeric(this)"></p>
<p>Enter the width of your object:&nbsp - <input type = "text" name = "width" size = "3" maxlength = "3" onKeyUp="checkNumeric(this)"></p>
<p>Enter the height of your object: - <input type = "text" name = "height" size = "3" maxlength = "3" onKeyUp="checkNumeric(this)"></p>
<p>These dimensions are in:</p>
<p> <input type = "radio" name = "rad1" value = "in" checked = "true"> Inches</p>
<p> <input type = "radio" name = "rad1" value = "cm"> Centimeters</p>
<p> <input type = "button" value = "Calculate - will it fit?" onclick="calculate()" ></p>
<p id="Message" > </p>

<input type="reset" value="Reset" onClick="return Reset();">

<script type = "text/javascript">

function Reset(){
var responce=confirm('Are you sure you want to clear all your entries? ');
if (responce){
var frm=document.myform
frm.lgth.style.backgroundColor='#FFFFFF';
frm.width.style.backgroundColor='#FFFFFF';
frm.height.style.backgroundColor='#FFFFFF';
document.getElementById('Message').innerHTML='';
}

return responce;
}

function calculate() {
var frm=document.myform
var cf = 1; // conversion factor

if (frm.rad1[0].checked) {
cf = 0.3937; // inches in one cm
}
var mess=[];
frm.lgth.style.backgroundColor='#FF0000';
if (frm.lgth.value == 0) {
mess.push("You must enter the length of your object");
}
else if (frm.lgth.value > 58*cf) {
mess.push("Your object is too long");
}
else {
frm.lgth.style.backgroundColor='#00FF00';
}
frm.width.style.backgroundColor='#FF0000';
if (frm.width.value == 0) {
mess.push("You must enter the width of your object");
}
else if (frm.width.value > 36*cf) {
mess.push("Your object is too wide");
}
else {
frm.width.style.backgroundColor='#00FF00';
}

frm.height.style.backgroundColor='#FF0000';
if (frm.height.value == 0) {
mess.push("You must enter the height of your object");
}
else if (frm.height.value > 31*cf) {
mess.push("Your object is too high");
}
else {
frm.height.style.backgroundColor='#00FF00';
}
if (mess.length>0){
document.getElementById('Message').innerHTML=mess.join('<br>');
return false;
}
document.getElementById('Message').innerHTML=("<b>Your object will fit into the Box (VCB)</b>");
return true;
}

function checkNumeric(which) {
if (/\D/.test(which.value)) {
alert ("Only numbers are valid!");
which.value = which.value.slice(0, -1); // remove invalid character
return false;
}
}

</script>
</body>

</html>