Commas in javascript calculator answer

Commas in javascript calculator answer - javascript

I'm trying to add commas to my output answers in JavaScript calculator. I updated an old calculator that was used on a previous website that I maintained and it's working, but I can't get the answers to show up with the comma. I was excited I figured out how to round to 2 decimal places. I've tried a few different things that I feel like might have worked, but I was missing something in how to change the code since my code is set up differently than the examples I saw.
function clear_buildingCalc() {
document.buildingCalc.ICCVal.value = "";
document.buildingCalc.permitFee.value = "";
document.buildingCalc.planReview.value = "";
document.buildingCalc.Subtotal.value = "";
document.buildingCalc.DBPR.value = "";
document.buildingCalc.DCA.value = "";
document.buildingCalc.totalFee.value = "";
document.buildingCalc.Subtotaldisc.value = "";
document.buildingCalc.DBPRdisc.value = "";
document.buildingCalc.DCAdisc.value = "";
document.buildingCalc.totalFeedisc.value = "";
}
function calcBuilding(ICCVal) {
var validNums = "0123456789"
var flag = "yes";
var tempChar;
for (var c = 0; c < ICCVal.value.length; c++) {
tempChar = "" + ICCVal.value.substring(c, c + 1);
if (validNums.indexOf(tempChar) == "-1") {
flag = "no";
}
}
if (flag == "no") {
alert("Please enter only whole numbers.");
}
if (flag == "yes") {
if (document.buildingCalc.ICCVal.value == "") {
alert("Please enter the ICC valuation.");
} else {
var addlFee = 5.26;
var baseFee = 968.50;
var roundICC = Math.round(ICCVal.value - 100000) / 1000;
var permitFee = Math.round((addlFee * roundICC) * 1000) / 1000;
var permitFee2 = Math.round((permitFee + baseFee) * 100) / 100;
var planReviewRate = 0.25;
var planReview = Math.round((planReviewRate * permitFee2) * 1000) / 1000;
var Subtotal = Math.round((permitFee2 + planReview) * 100) / 100;
var DBPRRate = 0.015;
var DBPR = Math.round((DBPRRate * Subtotal) * 100) / 100;
var DCARate = 0.01;
var DCA = Math.round((DCARate * Subtotal) * 100) / 100;
var totalFee = Math.round((Subtotal + DBPR + DCA) * 100) / 100;
var Subtotaldisc = Math.round((Subtotal * 0.25) * 100) / 100;
var DBPRRatedisc = 0.015;
var DBPRdisc = Math.round((DBPRRatedisc * Subtotaldisc) * 100) / 100;
var DCARatedisc = 0.01;
var DCAdisc = Math.round((DCARatedisc * Subtotaldisc) * 100) / 100;
var totalFeedisc = Math.round((Subtotaldisc + DBPRdisc + DCAdisc) * 100) / 100;
document.buildingCalc.permitFee.value = permitFee2;
document.buildingCalc.planReview.value = planReview;
document.buildingCalc.Subtotal.value = Subtotal;
document.buildingCalc.DBPR.value = DBPR;
document.buildingCalc.DCA.value = DCA;
document.buildingCalc.totalFee.value = totalFee;
document.buildingCalc.Subtotaldisc.value = Subtotaldisc;
document.buildingCalc.DBPRdisc.value = DBPRdisc;
document.buildingCalc.DCAdisc.value = DCAdisc;
document.buildingCalc.totalFeedisc.value = totalFeedisc;
}
}
}
<form name="buildingCalc">
<table border="0" cellpadding="5" bordercolor="#000000">
<tr>
<td width="350" valign="bottom"><span class="body">Enter the ICC valuation (round to the nearest thousand) Example: 342778.20 is 343000 </span></td>
<td align="center" valign="bottom">
<div class="body">$<input type="text" name="ICCVal">
</div>
</td>
</tr>
<tr>
<td colspan="2">
<span class="body"><input type="button" onClick="calcBuilding(ICCVal)" value="Calculate building permit fee"></span>
</td>
</tr>
<tr>
<td>
<div class="body">Building permit fee</div>
</td>
<td align="center" class="body">$<input type="text" name="permitFee">
</td>
</tr>
<tr>
<td>
<div class="body">Plan review 25%</div>
</td>
<td class="body">$<input type="text" name="planReview">
</td>
</tr>
<tr>
<td>
<div class="body">Subtotal</div>
</td>
<td class="body">$<input type="text" name="Subtotal">
</td>
</tr>
<tr>
<td>
<div class="body">DBPR 1.5%</div>
</td>
<td class="body">$<input type="text" name="DBPR">
</td>
</tr>
<tr>
<td>
<div class="body">DCA 1%</div>
</td>
<td class="body">$<input type="text" name="DCA">
</td>
</tr>
<tr>
<td>
<div class="body">Total building permit fee</div>
</td>
<td class="body">$<input type="text" name="totalFee">
</td>
</tr>
<tr>
<td colspan="2" class="body">
<p><strong> <label>Does not include impact fees (if applicable), or Fire fees for commercial permits.</label>
</strong></p>
<p class="subpagesubheader">Fees effective Jan. 1, 2021 with 75% reduction applied </p>
</td>
</tr>
<tr>
<td>
<div class="body">Subtotal</div>
</td>
<td class="body">$<input type="text" name="Subtotaldisc">
</td>
</tr>
<tr>
<td>
<div class="body">DBPR 1.5%</div>
</td>
<td class="body">$<input type="text" name="DBPRdisc">
</td>
</tr>
<tr>
<td>
<div class="body">DCA 1%</div>
</td>
<td class="body">$<input type="text" name="DCAdisc">
</td>
</tr>
<tr>
<td>
<div class="body">Total building permit fee</div>
</td>
<td class="body">$<input type="text" `enter code here`name="totalFeedisc">
</td>
</tr>
<tr>
<td colspan="2" class="body">
<p><input type="button" onClick="clear_buildingCalc()" value="Clear calculation"></p>
</table>
</form>

Javascript
<script language="JavaScript">
function clear_ICCCalc()
{
document.ICCCalc.OccupancyConst.value = "";
document.ICCCalc.SquareFeet.value = "";
document.getElementById("result").innerHTML = "";
}
function multiplyBy()
{
num1 = document.getElementById("OccupancyConst").value;
num2 = document.getElementById("SquareFeet").value;
document.getElementById("result").innerHTML = num1 * num2;
}
</script>

You can use .toLocaleString(); when assigning the values. For e.g
document.buildingCalc.totalFeedisc.value = totalFeedisc.toLocaleString()
If you want decimal to work include . inside var validNums = "0123456789."
That way you can keep the functionality & change anytime you want
function clear_buildingCalc() {
document.buildingCalc.ICCVal.value = "";
document.buildingCalc.permitFee.value = "";
document.buildingCalc.planReview.value = "";
document.buildingCalc.Subtotal.value = "";
document.buildingCalc.DBPR.value = "";
document.buildingCalc.DCA.value = "";
document.buildingCalc.totalFee.value = "";
document.buildingCalc.Subtotaldisc.value = "";
document.buildingCalc.DBPRdisc.value = "";
document.buildingCalc.DCAdisc.value = "";
document.buildingCalc.totalFeedisc.value = "";
}
function calcBuilding(ICCVal) {
var validNums = "0123456789."
var flag = "yes";
var tempChar;
for (var c = 0; c < ICCVal.value.length; c++) {
tempChar = "" + ICCVal.value.substring(c, c + 1);
if (validNums.indexOf(tempChar) == "-1") {
flag = "no";
}
}
if (flag == "no") {
alert("Please enter only whole numbers.");
}
if (flag == "yes") {
if (document.buildingCalc.ICCVal.value == "") {
alert("Please enter the ICC valuation.");
} else {
var addlFee = 5.26;
var baseFee = 968.50;
var roundICC = Math.round(ICCVal.value - 100000) / 1000;
var permitFee = Math.round((addlFee * roundICC) * 1000) / 1000;
var permitFee2 = Math.round((permitFee + baseFee) * 100) / 100;
var planReviewRate = 0.25;
var planReview = Math.round((planReviewRate * permitFee2) * 1000) / 1000;
var Subtotal = Math.round((permitFee2 + planReview) * 100) / 100;
var DBPRRate = 0.015;
var DBPR = Math.round((DBPRRate * Subtotal) * 100) / 100;
var DCARate = 0.01;
var DCA = Math.round((DCARate * Subtotal) * 100) / 100;
var totalFee = Math.round((Subtotal + DBPR + DCA) * 100) / 100;
var Subtotaldisc = Math.round((Subtotal * 0.25) * 100) / 100;
var DBPRRatedisc = 0.015;
var DBPRdisc = Math.round((DBPRRatedisc * Subtotaldisc) * 100) / 100;
var DCARatedisc = 0.01;
var DCAdisc = Math.round((DCARatedisc * Subtotaldisc) * 100) / 100;
var totalFeedisc = Math.round((Subtotaldisc + DBPRdisc + DCAdisc) * 100) / 100;
document.buildingCalc.permitFee.value = permitFee2.toLocaleString();
document.buildingCalc.planReview.value = planReview.toLocaleString();
document.buildingCalc.Subtotal.value = Subtotal.toLocaleString();
document.buildingCalc.DBPR.value = DBPR.toLocaleString();
document.buildingCalc.DCA.value = DCA.toLocaleString();
document.buildingCalc.totalFee.value = totalFee.toLocaleString();
document.buildingCalc.Subtotaldisc.value = Subtotaldisc.toLocaleString();
document.buildingCalc.DBPRdisc.value = DBPRdisc.toLocaleString();
document.buildingCalc.DCAdisc.value = DCAdisc.toLocaleString();
document.buildingCalc.totalFeedisc.value = totalFeedisc.toLocaleString();
}
}
}
<form name="buildingCalc">
<table border="0" cellpadding="5" bordercolor="#000000">
<tr>
<td width="350" valign="bottom"><span class="body">Enter the ICC valuation (round to the nearest thousand) Example: 342778.20 is 343000 </span></td>
<td align="center" valign="bottom">
<div class="body">$<input type="text" name="ICCVal">
</div>
</td>
</tr>
<tr>
<td colspan="2">
<span class="body"><input type="button" onClick="calcBuilding(ICCVal)" value="Calculate building permit fee"></span>
</td>
</tr>
<tr>
<td>
<div class="body">Building permit fee</div>
</td>
<td align="center" class="body">$<input type="text" name="permitFee">
</td>
</tr>
<tr>
<td>
<div class="body">Plan review 25%</div>
</td>
<td class="body">$<input type="text" name="planReview">
</td>
</tr>
<tr>
<td>
<div class="body">Subtotal</div>
</td>
<td class="body">$<input type="text" name="Subtotal">
</td>
</tr>
<tr>
<td>
<div class="body">DBPR 1.5%</div>
</td>
<td class="body">$<input type="text" name="DBPR">
</td>
</tr>
<tr>
<td>
<div class="body">DCA 1%</div>
</td>
<td class="body">$<input type="text" name="DCA">
</td>
</tr>
<tr>
<td>
<div class="body">Total building permit fee</div>
</td>
<td class="body">$<input type="text" name="totalFee">
</td>
</tr>
<tr>
<td colspan="2" class="body">
<p><strong> <label>Does not include impact fees (if applicable), or Fire fees for commercial permits.</label>
</strong></p>
<p class="subpagesubheader">Fees effective Jan. 1, 2021 with 75% reduction applied </p>
</td>
</tr>
<tr>
<td>
<div class="body">Subtotal</div>
</td>
<td class="body">$<input type="text" name="Subtotaldisc">
</td>
</tr>
<tr>
<td>
<div class="body">DBPR 1.5%</div>
</td>
<td class="body">$<input type="text" name="DBPRdisc">
</td>
</tr>
<tr>
<td>
<div class="body">DCA 1%</div>
</td>
<td class="body">$<input type="text" name="DCAdisc">
</td>
</tr>
<tr>
<td>
<div class="body">Total building permit fee</div>
</td>
<td class="body">$<input type="text" `enter code here` name="totalFeedisc">
</td>
</tr>
<tr>
<td colspan="2" class="body">
<p><input type="button" onClick="clear_buildingCalc()" value="Clear calculation"></p>
</table>
</form>

Related

How to determine how many years (D/M/Y) left from the Birthday to a certain age in age calculator?

What should I need to change to determine how many years (D/M/Y) left from the Birthday to a certain age? i.e my birthday is 01.01.1990 and and today my age is 27 Years, 5 month.... and I will 50 years old in 2040.
I want to know How many years left (DD/M/Y) from today to become 50 years old?
Another thing is Concern title should be just above the result not left side of the result.
Code below for this script and and two picture regarding this..
<!DOCTYPE html>
<html>
<head>
<script type='text/javascript'>
function wr_document()
{
var w=new Date();
var s_d=w.getDate();
var s_m=w.getMonth()+1;
var s_y=w.getFullYear();
document.cir.len11.value=s_d;
document.cir.len12.value=s_m;
document.cir.len13.value=s_y;
}
function isNum(arg)
{
var args = arg;
if (args == "" || args == null || args.length == 0)
{
return false;
}
args = args.toString();
for (var i = 0; i<args.length; i++)
{
if ((args.substring(i,i+1) < "0" || args.substring(i, i+1) > "9") && args.substring(i, i+1) != ".")
{
return false;
}
}
return true;
}
function checkday(aa)
{
var val = aa.value;
var valc = val.substring(0,1);
if(val.length>0 && val.length<3)
{
if(!isNum(val) || val == 0)
{
aa.value="";
}
else if( val < 1 || val > 31)
{
aa.value=valc;
}
}
else if(val.length>2)
{
val = val.substring(0, 2);
aa.value=val;
}
}
function checkmon(aa)
{
var val = aa.value;
var valc = val.substring(0,1);
if(val.length>0 && val.length<3)
{
if(!isNum(val) || val == 0)
{
aa.value="";
}
else if(val < 1 || val > 12)
{
aa.value=valc;
}
}
else if(val.length>2)
{
val = val.substring(0, 2);
aa.value=val;
}
}
function checkyear(aa)
{
var val = aa.value;
var valc = val.substring(0,(val.length-1));
if(val.length>0 && val.length<7)
{
if(!isNum(val) || val == 0)
{
aa.value=valc;
}
else if(val < 1 || val>275759)
{
aa.value="";
}
}
else if(val.length>4)
{
aa.value=valc;
}
}
function checkleapyear(datea)
{
if(datea.getYear()%4 == 0)
{
if(datea.getYear()% 10 != 0)
{
return true;
}
else
{
if(datea.getYear()% 400 == 0)
return true;
else
return false;
}
}
return false;
}
function DaysInMonth(Y, M) {
with (new Date(Y, M, 1, 12)) {
setDate(0);
return getDate();
}
}
function datediff(date1, date2) {
var y1 = date1.getFullYear(), m1 = date1.getMonth(), d1 = date1.getDate(),
y2 = date2.getFullYear(), m2 = date2.getMonth(), d2 = date2.getDate();
if (d1 < d2) {
m1--;
d1 += DaysInMonth(y2, m2);
}
if (m1 < m2) {
y1--;
m1 += 12;
}
return [y1 - y2, m1 - m2, d1 - d2];
}
function calage()
{
var curday = document.cir.len11.value;
var curmon = document.cir.len12.value;
var curyear = document.cir.len13.value;
var calday = document.cir.len21.value;
var calmon = document.cir.len22.value;
var calyear = document.cir.len23.value;
if(curday == "" || curmon=="" || curyear=="" || calday=="" || calmon=="" || calyear=="")
{
alert("Please fill all the values and click 'Go'");
}
else if(curday == calday && curmon==calmon && curyear==calyear)
{
alert("Today your birthday & Your age is 0 years old")
}
else
{
var curd = new Date(curyear,curmon-1,curday);
var cald = new Date(calyear,calmon-1,calday);
var diff = Date.UTC(curyear,curmon,curday,0,0,0)
- Date.UTC(calyear,calmon,calday,0,0,0);
var dife = datediff(curd,cald);
document.cir.val.value=dife[0]+" years, "+dife[1]+" months, and "+dife[2]+" days";
var secleft = diff/1000/60;
document.cir.val3.value=secleft+" minutes since your birth";
var hrsleft = secleft/60;
document.cir.val2.value=hrsleft+" hours since your birth";
var daysleft = hrsleft/24;
document.cir.val1.value=daysleft+" days since your birth";
//alert(""+parseInt(calyear)+"--"+dife[0]+"--"+1);
var as = parseInt(calyear)+dife[0]+1;
var diff = Date.UTC(as,calmon,calday,0,0,0)
- Date.UTC(curyear,curmon,curday,0,0,0);
var datee = diff/1000/60/60/24;
document.cir.val4.value=datee+" days left for your next birthday";
}
}
function color(test)
{
for(var j=7; j<12; j++)
{
var myI=document.getElementsByTagName("input").item(j);
//myI.setAttribute("style",ch);
myI.style.backgroundColor=test;
}
}
function color1(test)
{
var myI=document.getElementsByTagName("table").item(0);
//myI.setAttribute("style",ch);
myI.style.backgroundColor=test;
}
</script>
<style media="screen" type="text/css">
.cal-container {
width: 540px;
margin: 10px auto 0;
}
#age-calculator {
background: none repeat scroll 0 0 #DDDDDD;
border: 1px solid #BEBEBE;
padding-left: 20px;
}
.calc {
border-color: #AAAAAA #999999 #929292 #AAAAAA;
border-style: solid;
border-width: 1px 2px 2px 1px;
padding: 2px 30px 3px;
height: 27px;
}
.calc:active {
border-color: #AAAAAA #999999 #929292 #AAAAAA;
border-style: solid;
border-width: 1px;
}
</style>
<title>Age calculator</title>
</head>
<body onLoad="wr_document()">
<div class="cal-container">
<div id="calculator-container">
<table width="100%" cellspacing="0" cellpadding="0" border="0">
<tbody>
<tr>
<td valign="top">
<h1 style="padding-top: 10px;">Age Calculator</h1>
<div class="descalign">
<span>Calculate your age in days, years, minutes, seconds. Know how many days are left for your next birthday.</span><br/><br/>
</div>
<div id="age-calculator">
<table width="100%" cellspacing="4" cellpadding="0" border="0" bgcolor="">
<tbody>
<tr>
<td colspan="2">
<table class="result" width="100%" height="100%">
<tbody>
<tr>
<td>
<form name="cir">
<table cellspacing="0" cellpadding="3">
<tbody>
<tr>
<td colspan="2">
<br>
Today's Date is:
</td>
</tr>
<tr>
<td align="center" colspan="2">
Date -
<input class="innerc resform" type="text" value="" onkeyup="checkday(this)" size="2" name="len11">
Month -
<input class="innerc resform" type="text" value="" onkeyup="checkmon(this)" size="2" name="len12">
Year -
<input class="innerc resform" type="text" value="" onkeyup="checkyear(this)" size="4" name="len13">
<br>
<br>
</td>
</tr>
<tr>
<td colspan="2"> Enter Your Date of Birth : </td>
</tr>
<tr>
<td align="center" colspan="2">
Date -
<input class="innerc resform" type="text" onkeyup="checkday(this)" size="2" name="len21">
Month -
<input class="innerc resform" type="text" onkeyup="checkmon(this)" size="2" name="len22">
Year -
<input class="innerc resform" type="text" onkeyup="checkyear(this)" size="4" name="len23">
<br>
<br>
<input class="calc" type="button" onclick="calage()" value=" Go " name="but">
<br>
<br>
</td>
</tr>
<tr>
<td class="form" width="30%" align="center">
<b> </b>
</td>
</tr>
</tbody>
</table>
<table>
<tbody>
<tr>
<td>
<b> Your Age is </b>
</td>
<td>
<input class="resform" type="text" readonly="" size="36" name="val">
</td>
</tr>
<tr>
<td>
<b> Your Age in Days </b>
</td>
<td>
<input class="resform" type="text" readonly="" size="36" name="val1">
</td>
</tr>
<tr>
<td>
<b> Your Age in Hours </b>
</td>
<td>
<input class="resform" type="text" readonly="" size="36" name="val2">
(Approximate)
</td>
</tr>
<tr>
<td class="form">
<b> Your Age in Minutes </b>
</td>
<td>
<input class="resform" type="text" readonly="" size="36" name="val3">
(Approximate)
</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td>
<b> Your Next Birthday</b>
</td>
<td>
<input class="innerc resform" type="text" readonly="" size="36" name="val4">
</td>
</tr>
</tbody>
</table>
</form>
</td>
</tr>
</tbody>
</table>
<br>
</td>
<td> </td>
</tr>
<tr>
<td align="right" colspan="2"> </td>
<td> </td>
</tr>
</tbody>
</table>
</div>
<br>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</body>
</html>

There's a number of ways to achieve what you're asking.
For the formatting, you could define CSS rules for the table to be something like:
width: 100%;
text-align: center;
For the time until the 50th birthday, you could add 50 years in ms to the birth date and calculate accordingly, however you might need to be aware of the following in your calculations:
https://en.wikipedia.org/wiki/Year_2038_problem

How to get sum of onload inputs

HTML:
<table id="tab1">
<tr id="maint">
<td style="background-color:white;"></td>
<td>słowo klucz</td>
<td>ilość wynikow google</td>
</tr>
<tr>
<td id="maint">słowo klucz</td>
<td><input type="text" name="klucz" value="" required></td>
<td><input type="number" name="wyszkiwania" value="" onblur="sumX()" onkeyup="operatorf()" id="eq"required></td>
</tr>
<tr>
<td id="maint">słowo klucz</td>
<td><input type="text" name="klucz" value=""></td>
<td><input type="number" name="wyszkiwania" value="" onblur="sumX()" onkeyup="operatorf()" id="eq"required></td>
</tr>
</table>
JS:
var wejscie = document.getElementById('eq').value;
if ( wejscie <= 100000) {
var stawka13 = 59;
var stawka46 = stawka13*0.75;
var stawka710 = stawka46*0.55;
}
else {
var stawka13 = wejscie/100000*59;
if (stawka13 > 210) {
stawka13 = 210;
}
var stawka46 = stawka13*0.75;
var stawka710 = stawka46*0.55;
}
stawka13 = Math.round(stawka13).toFixed(2);
stawka46 = Math.round(stawka46).toFixed(2);
stawka710 = Math.round(stawka710).toFixed(2);
document.getElementById('sum13').innerHTML = "";
document.getElementById('sum46').innerHTML = "";
document.getElementById('sum710').innerHTML = "";
document.getElementById('sum13').innerHTML = " "+sum13+" zł";
document.getElementById('sum46').innerHTML = " "+sum46+" zł";
document.getElementById('sum710').innerHTML = " "+sum710+" zł";
I would like to get an sum of it but with this eq.
I try arr etc but aint work "properly" as I want.
My target is just sum all of it with all math in it.
I'm not allowed to add jq to it so it is impotant to stay on meta.

After setInterval( ) on click function will not work...Variable no longer increments

The code works for the most part.
Whenever the interval is set to refresh the game card, the onclick functions no longer work and the variable no longer increments.
What am I missing here?
You Can comment out the line with the setInterval() to see the desired outcome. It should refresh every second keeping the variable score and incrementing whenever someone clicks on the images. Thanks!
// var btn = document.getElementById('btn');
//btn.addEventListener('click', UpdateTable);
// Set the max length and Width
var maxWidth = 4;
var maxLength = 6;
// Returns a random number
function CreateRandom() {
return Math.floor(Math.random() * 2 + 1);
}
//function to create an image
function CreateGopher() {
var randomNumber = CreateRandom();
var image = "Sup";
if (randomNumber == 1) {
image = "<img src='gopher.jpg' class='gopher' height='100' width='100'>";
} else if (randomNumber == 2) {
image = "<img src='lettuce.jpg' class='lettuce' height='100' width='100'>";
}
return image;
}
//create table
function UpdateTable() {
// Iterate over each cell and set a random number
for (var i = 0; i < maxLength; i++) {
for (var j = 0; j < maxWidth; j++) {
tmp = 'cell' + i + j;
document.getElementById(tmp).innerHTML = CreateGopher();
}
}
}
function newTable() {
// Iterate over each cell and set a random number
for (var i = 0; i < maxLength; i++) {
for (var j = 0; j < maxWidth; j++) {
tmp = 'cell' + i + j;
document.getElementById(tmp).innerHTML = CreateGopher();
}
}
}
//Use The function update table
UpdateTable();
setTimeout(function() {
alert("Your Score is " + score)
}, 15000);
setInterval(UpdateTable, 1000);
var score = 0;
$(".lettuce").click(function() {
//alert( "You Clicked on the lettuce" );
score -= 5;
document.getElementById("scoreOut").innerHTML = score;
});
$(".gopher").click(function() {
//alert( "You Clicked on the lettuce" );
score += 5;
document.getElementById("scoreOut").innerHTML = score;
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<center>
<div id="container">
<div id="header">
<h1>Welcome</h1>
<div id="scoreOut"></div>
</div>
<div id="content">
<table id="gameCard">
<tbody>
<tr>
<td id="cell00"> </td>
<td id="cell01"> </td>
<td id="cell02"> </td>
<td id="cell03"> </td>
</tr>
<tr>
<td id="cell10"> </td>
<td id="cell11"> </td>
<td id="cell12"> </td>
<td id="cell13"> </td>
</tr>
<tr>
<td id="cell20"> </td>
<td id="cell21"> </td>
<td id="cell22"> </td>
<td id="cell23"> </td>
</tr>
<tr>
<td id="cell30"> </td>
<td id="cell31"> </td>
<td id="cell32"> </td>
<td id="cell33"> </td>
</tr>
<tr>
<td id="cell40"> </td>
<td id="cell41"> </td>
<td id="cell42"> </td>
<td id="cell43"> </td>
</tr>
<tr>
<td id="cell50"> </td>
<td id="cell51"> </td>
<td id="cell52"> </td>
<td id="cell53"> </td>
</tr>
</tbody>
</table>
</div>
</div>
<br>
//<input id="btn" type="button" value="Play The Game!!" />
</center>

Figured it out!
Needed to put my JQUERY on.click goodies in the actual main function, which I did not have in the first place, in with the other functions nested in it.
<!--
To change this template use Tools | Templates.
-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Gopher Broke</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<style>
#gameCard td{
padding:0; margin:0;
}
#gameCard {
border-collapse: collapse;
cursor:url(finger2.png), pointer;
}
</style>
</head>
<body>
<center>
<div id="container">
<div id="header">
<h1>GOPHER BROKE</h1>
<center>You have 15 seconds to stop as many gophers as possible!</center>
<div id="scoreOut">Score:</div>
<FORM>
<INPUT TYPE="button" onClick="history.go(0)" VALUE="Refresh">
</FORM>
</div>
<div id="content">
<table id="gameCard">
<tbody>
<tr>
<td id="cell00"> </td>
<td id="cell01"> </td>
<td id="cell02"> </td>
<td id="cell03"> </td>
</tr>
<tr>
<td id="cell10"> </td>
<td id="cell11"> </td>
<td id="cell12"> </td>
<td id="cell13"> </td>
</tr>
<tr>
<td id="cell20"> </td>
<td id="cell21"> </td>
<td id="cell22"> </td>
<td id="cell23"> </td>
</tr>
<tr>
<td id="cell30"> </td>
<td id="cell31"> </td>
<td id="cell32"> </td>
<td id="cell33"> </td>
</tr>
<tr>
<td id="cell40"> </td>
<td id="cell41"> </td>
<td id="cell42"> </td>
<td id="cell43"> </td>
</tr>
<tr>
<td id="cell50"> </td>
<td id="cell51"> </td>
<td id="cell52"> </td>
<td id="cell53"> </td>
</tr>
</tbody>
</table>
</div>
</div>
<br>
<!--<input id="btn" type="button" value="Play The Game!!" />-->
</center>
<script>
var score = 0;
function game(){
// var btn = document.getElementById('btn');
//btn.addEventListener('click', UpdateTable);
// Set the max length and Width
var maxWidth = 4;
var maxLength = 6;
// Returns a random number
function CreateRandom() {
return Math.floor(Math.random() * 4 + 1);
}
//function to create an image
function CreateGopher() {
var randomNumber = CreateRandom();
var image = "Sup";
if(randomNumber == 1){
image = "<img src='gopher.jpg' class='gopher' height='50' width='50'>";
}
else if(randomNumber == 2){
image = "<img src='lettuce.jpg' class='lettuce' height='50' width='50'>";
}
else if(randomNumber == 3){
image = "<img src='lettuce.jpg' class='lettuce' height='50' width='50'>";
}
else if(randomNumber == 4){
image = "<img src='lettuce.jpg' class='lettuce' height='50' width='50'>";
}
return image;
}
//create table
function UpdateTable() {
// Iterate over each cell and set a random number
for (var i = 0; i < maxLength; i++) {
for (var j = 0; j < maxWidth; j++) {
tmp = 'cell' + i + j;
document.getElementById(tmp).innerHTML = CreateGopher();
}
}
}
function newTable() {
// Iterate over each cell and set a random number
for (var i = 0; i < maxLength; i++) {
for (var j = 0; j < maxWidth; j++) {
tmp = 'cell' + i + j;
document.getElementById(tmp).innerHTML = CreateGopher();
}
}
}
//Use The function update table
UpdateTable();
$( ".lettuce" ).click(function() {
//alert( "You Clicked on the lettuce" );
score -= 5;
document.getElementById("scoreOut").innerHTML = "<h1>Score :" + score;
});
$( ".gopher" ).click(function() {
//alert( "You Clicked on the lettuce" );
score += 5;
document.getElementById("scoreOut").innerHTML = "<h1>Score :" + score;
});
}
game();
setInterval(game, 1000);
setTimeout(function ()
{alert("Your Score is " + score)
window.location.href = "startGame.html";
}, 16000);
</script>
</body>
</html>

Javascript - check form field value and display error message if value is 0

I have a Javascript that's running on an html form that performs some calculations based on the values the user has entered and then enters the results into some other fields. This is all working well. Here's what the HTML looks like:
<table width="100%" border="0" cellspacing="0" cellpadding="10" class="border" id="calcs">
<tr class="d_green">
<td colspan="4">LAST YEAR</td>
</tr>
<tr class="l_white">
<td width="53%">number of instances in the last year </td>
<td width="13%" align="right"><input name="textfield1" type="text" class="input_b_r" id="textfield1" value="0" /></td>
<td width="24%"> </td>
<td width="10%"> </td>
</tr>
<tr class="l_green">
<td>average number of moderate-risk activity per week in the last year</td>
<td align="right"><input name="textfield2" type="text" class="input_b_r" id="textfield2" value=""/></td>
<td> </td>
<td> </td>
</tr>
<tr class="l_white">
<td>average number of hours of high-risk activity per week in the last year</td>
<td align="right"><input name="textfield3" type="text" class="input_b_r" id="textfield3" value=""/></td>
<td> </td>
<td> </td>
</tr>
<tr class="d_green">
<td colspan="4">NEXT YEAR</td>
</tr>
<tr class="l_white">
<td>expected average number of hours of moderate-risk activity per week next year</td>
<td align="right"><input name="textfield4" type="text" class="input_b_r" id="textfield4" value=""/></td>
<td> </td>
<td> </td>
</tr>
<tr class="l_green">
<td>expected average number of hours of high-risk activity per week next year</td>
<td align="right"><input name="textfield5" type="text" class="input_b_r" id="textfield5" value=""/></td>
<td> </td>
<td> </td>
</tr>
<tr class="l_white">
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr class="l_green">
<td> </td>
<td colspan="2" style="padding-left:31px;"><input type="submit" name="button" id="Calculate" value="Calculate" class="button_calculate" /></td>
<td> </td>
</tr>
<tr class="l_white">
<td> </td>
<td colspan="2" style="padding-left:105px;">predicted number of instances next year</td>
<td><input name="textfield6" type="text" class="input_b" id="textfield6" /></td>
</tr>
<tr class="l_green">
<td> </td>
<td colspan="2" style="padding-left:105px;">extra instances next year</td>
<td><input name="textfield7" type="text" class="input_b" id="textfield7" /></td>
</tr>
</table>
and here's the Javascript:
$(document).ready(function(){
$('#Calculate').click(function(){
var IRRC2 = 1.35;
var IRRC3 = 2.75;
var Npast = Number($("#textfield1").val());
var t2hrswk = Number($("#textfield2").val());
var t3hrswk = Number($("#textfield3").val());
var t2nexthrswk = Number($("#textfield4").val());
var t3nexthrswk = Number($("#textfield5").val());
var t2epyr = t2hrswk * 6 * 52;
var t3epyr = t3hrswk * 6 * 52;
var t01epyr = 52 * 7 * 24 * 6 - t2epyr - t3epyr;
var epochBaseInstances = Npast / (t01epyr + IRRC2 * t2epyr + IRRC3 * t3epyr);
var baselineCoefficient = Math.log(epochBaseInstances);
var t2nextepyr = t2nexthrswk * 6 * 52;
var t3nextepyr = t3nexthrswk * 6 * 52;
var t01nextepyr = 52 * 7 * 24 * 6 - t2nextepyr - t3nextepyr;
var predictedInstances = Math.exp(baselineCoefficient) * (t01nextepyr + IRRC2 * t2nextepyr + IRRC3 * t3nextepyr);
var roundedPredictedInstances = Math.round( predictedInstances * 10 ) / 10;
var lastYearTotal = Number($("#textfield1").val());
var extraInstancesRounded = Math.round( (roundedPredictedInstances - lastYearTotal) * 10 ) / 10;
$('#textfield6').val(roundedPredictedInstances);
$('#textfield7').val(extraInstancesRounded);
});
});
I know need to modify this so that if the value of the first form field (textfield1) is 0 when the user clicks the Calculate button it detects this and then exits, displaying an error message (e.g. "the value for Last Year cannot be zero").
Everything I've tried so far has broken the Javascript - appreciate any assistance with how to proceed.

Try this code, just after the Npast decleration:
var Npast = Number($("#textfield1").val());
if (Npast === 0) {
alert("the value for Last Year cannot be zero");
return;
}

Add this conditional statement toward the bottom:
if ( !Npast ) {
alert('Error!');
return false;
}
Here's a working demo of the fix: http://jsfiddle.net/38PGy/

Try this
var last_year = $("#textfield1").val();
if (last_year == 0) {
alert("The value for Last Year cannot be zero, please enter valid number");
return;
}

you could try adding validations for your textfields
here is a sample:
$(document).ready(function(){
$('#Calculate').on('click',function(){
if (!validateTextField()){
alert('no zeroes');
} else {
alert('zeroes');
}
});
});
function validteTextField(){
//$('input[id^=textfield]') --> selects all input with id having a prefix textfield
$('input[id^=textfield]').css('background-color','white');
var flg = false;
$('input[id^=textfield]').each(function(){
if ($(this).val() === 0 || $(this).val().length === 0){
$(this).css('background-color','pink');
flg = true;
}
});
return flg;
}
jsFiddle demo

Pass a field calculation in html to another field in the SAME form

So, I can only find how to pass the information to another page not the same page and this has to be done entirely on the client side, no server side work as there will be no internet connection when this is used, hence the mailto for the form data so it can be sent when a connection is available.
Basically I have two tables, one on the left that has a standard set of numbers (fields time1-time8) that the user can change if need be. These values total into the 'designhours' field. That number must be put into the 'designhours' field on the right side for the various calculations needed there. In my former work (not HTML or javascript) if the field name was the same the data was passed, obviously not the case here.
Before I put the table on the left in, this form worked beautifully, but now I need to add the option of totaling a new 'designhours' value. Many thanks to those that have helped me before and many thanks to anyone that helps now. I am still learning, but I am getting there.
Sample code with most fields removed so you can see what I am doing (thanks for pointing out) Full code way below...
So the field names in the left table
time1 - time8
those values are added to put the total in designhours
And the right table
wage, instructors, class, designhours (which is the same as in the left table), cost, many, atetextfield7, build_cost, buy_cost, build_hours, buy_hours, build_train, buy_train, build_total, buy_total
<script type="text/javascript">
var btn = document.getElementById('calculate');
btn.onclick = function() {
var wageval = parseInt(document.getElementById('wage').value) || 0;
var instructorsval = parseInt(document.getElementById('instructors').value) || 0;
var build_cost = document.getElementById('build_cost');
var buy_cost = document.getElementById('buy_cost');
var msg = [];
if (isNaN(wageval)) {
msg.push('Average instructor hourly wage is not a number');
// the value isn't a number
}
if (isNaN(instructorsval)) {
msg.push('Number of instructors per course is not a number');
// the value isn't a number
}
if (msg.length > 0)   {
build_cost.value = msg.join(', ');
buy_cost.value = msg.join(', ');
and the calculations below:
} else {
designhours.value = (time1 + time2 + time3 + time4 + time5 + time6 + time7 + time8);
build_cost.value = (wageval * designhoursval);
buy_cost.value = (costval * hiddenval);
build_hours.value = (designhoursval * manyval);
build_train.value = (classval * hiddenval);
build_total.value = (wageval * designhoursval * manyval + classval);
buy_total.value = (costval * manyval);
var build_costval = parseInt(build_cost.value) || 0;
var buy_costval = parseInt(buy_cost.value) || 0;
var build_hoursval = parseInt(build_hours.value) || 0;
var build_trainval = parseInt(build_train.value) || 0;
var build_totalval = parseInt(build_total.value) || 0;
var buy_totalval = parseInt(buy_total.value) || 0;
var designhoursval = parseInt(designhours.value) || 0;
}
Full Code below
HTML
<form id="form1" name="form1" method="post" action="mailto:?subject=Laerdal%20ROI%20Information" enctype="text/plain">
<table width="859" border="0" cellpadding="0" cellspacing="0">
<tr>
<td valign="bottom">
<table width="352" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="22" colspan="2"> </td>
</tr>
<tr>
<td width="225" height="22"> </td>
<td width="127" height="22" align="left"> </td>
</tr>
<tr>
<td height="22"><span class="norm">Needs Analysis</span></td>
<td height="22" align="center"><input name="time1" type="text" class="field" id="time1" value="1" size="10" /></td>
</tr>
<tr>
<td height="22"><span class="norm">Research</span></td>
<td height="22" align="center"><input name="time2" type="text" class="field" id="time2" value="2" size="10" /></td>
</tr>
<tr>
<td height="22"><span class="norm">Design</span></td>
<td height="22" align="center"><input name="time3" type="text" class="field" id="time3" value="2" size="10" /></td>
</tr>
<tr>
<td height="22"><span class="norm">Scenario Programming</span></td>
<td height="22" align="center"><input name="time4" type="text" class="field" id="time4" value="3" size="10" /></td>
</tr>
<tr>
<td height="22"><span class="norm">Support Materials</span></td>
<td height="22" align="center"><input name="time5" type="text" class="field" id="time5" value="16" size="10" /></td>
</tr>
<tr>
<td height="22"><span class="norm">Validation</span></td>
<td height="22" align="center"><input name="time6" type="text" class="field" id="time6" value="2" size="10" /></td>
</tr>
<tr>
<td height="22"><span class="norm">Revision</span></td>
<td height="22" align="center"><input name="time7" type="text" class="field" id="time7" value="4" size="10" /></td>
</tr>
<tr>
<td height="22"><span class="norm">Implementation</span></td>
<td height="22" align="center"><input name="time8" type="text" class="field" id="time8" value="2" size="10" /></td>
</tr>
<tr>
<td height="22"><span class="norm">Total</span></td>
<td height="22" align="center"><input name="designhours" class="field" type="text" id="designhours" size="10" /></td>
</tr>
<tr>
<td height="73" colspan="2"> </td>
</tr>
</table>
<p> </p></td>
<td width="55" valign="bottom"> </td>
<td>
<table width="440" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="36" colspan="2" align="right" class="norm">Average Instructor hourly wage:</td>
<td height="36" align="right"><input name="wage" class="field" type="text" id="wage" size="12" /></td>
</tr>
<tr>
<td height="36" colspan="2" align="right" class="norm">Number of Instructors per course:</td>
<td height="36" align="right"><input name="instructors" class="field" type="text" id="instructors" size="12" /></td>
</tr>
<tr>
<td height="36" colspan="2" align="right" class="norm">Scenario Programing Class:</td>
<td height="36" align="right"><input name="class" class="field" type="text" id="class" size="12" /></td>
</tr>
<tr>
<td height="36" colspan="2" align="right" class="norm">Instruction design hours per scenarios:</td>
<td height="36" align="right"><input name="designhours" class="field" type="text" readonly="true" id="designhours" size="12" /></td>
</tr>
<tr>
<td height="36" colspan="2" align="right" class="norm">Average cost of SimStore Scenarios:</td>
<td height="36" align="right"><input name="cost" class="field" type="text" id="cost" value="295" size="12" /></td>
</tr>
<tr>
<td height="36" colspan="2" align="right" class="norm">How many scenarios do you need:</td>
<td height="36" align="right"><input name="many" class="field" type="text" id="many" size="12" /></td>
</tr>
<tr>
<td height="36" colspan="2" align="right" class="norm">Date needed?:</td>
<td height="36" align="right"><input name="atetextfield7" class="field" type="text" id="atetextfield7" size="12" /></td>
</tr>
<tr>
<td height="40" colspan="3" align="center" class="calc">CALCULATED RESULTS</td>
</tr>
<tr>
<td height="40"><input name="hidden" type="hidden" id="hidden" value="1" /></td>
<td height="40" align="center" class="bold">BUILD</td>
<td height="40" align="center" class="bold">BUY</td>
</tr>
<tr>
<td height="38" align="right" class="norm">Cost per scenario:<img src="images/Blank.png" alt="" width="12" height="5" /></td>
<td height="38" align="center"><input name="build_cost" class="field" type="text" id="build_cost" size="12" /></td>
<td height="38" align="center"><input name="buy_cost" class="field" type="text" id="buy_cost" size="12" /></td>
</tr>
<tr>
<td height="38" align="right" class="norm">Total development hours:<img src="images/Blank.png" alt="" width="12" height="5" /></td>
<td height="38" align="center"><input name="build_hours" class="field" type="text" id="build_hours" size="12" /></td>
<td height="38" align="center"><input name="buy_hours" class="field" type="text" id="buy_hours" value="0" size="12" /></td>
</tr>
<tr>
<td height="38" align="right" class="norm">
Scenario Programming<img src="images/Blank.png" alt="" width="12" height="5" /><br />
Training (8h):<img src="Blank.png" alt="" width="12" height="5" />
</td>
<td height="38" align="center"><input name="build_train" class="field" type="text" id="build_train" size="12" /></td>
<td height="38" align="center"><input name="buy_train" class="field" type="text" id="buy_train" value="0" size="12" /></td>
</tr>
<tr>
<td height="38" align="right" class="norm">Total Cost:<img src="images/Blank.png" alt="" width="12" height="5" /></td>
<td height="38" align="center"><input name="build_total" class="field" type="text" id="build_total" size="12" /></td>
<td height="38" align="center"><input name="buy_total" class="field" type="text" id="buy_total" size="12" /></td>
</tr>
<tr>
<td height="50" colspan="3" align="center" valign="bottom"><input type="reset" />
<img src="images/Blank.png" alt="" width="15" height="25" />
<input name="calculate" type="button" id="calculate" value="Calculate" />
<img src="images/Blank.png" alt="" width="15" height="25" />
<input name="share" type="submit" id="submit" value="Share" />
</td>
</tr>
</table>
</td>
</tr>
</table>
</form>
Javascript
var btn = document.getElementById('calculate');
btn.onclick = function () {
//get the input values
var wageval = parseInt(document.getElementById('wage').value) || 0;
var instructorsval = parseInt(document.getElementById('instructors').value) || 0;
var classval = parseInt(document.getElementById('class').value) || 0;
var designhoursval = parseInt(document.getElementById('designhours').value) || 0;
var costval = parseInt(document.getElementById('cost').value) || 0;
var manyval = parseInt(document.getElementById('many').value) || 0;
var hiddenval = parseInt(document.getElementById('hidden').value) || 0;
var time1val = parseInt(document.getElementById('time1').value) || 0;
var time2val = parseInt(document.getElementById('time2').value) || 0;
var time3val = parseInt(document.getElementById('time3').value) || 0;
var time4val = parseInt(document.getElementById('time4').value) || 0;
var time5val = parseInt(document.getElementById('time5').value) || 0;
var time6val = parseInt(document.getElementById('time6').value) || 0;
var time7val = parseInt(document.getElementById('time7').value) || 0;
var time8val = parseInt(document.getElementById('time8').value) || 0;
// get the elements to hold the results
var build_cost = document.getElementById('build_cost');
var buy_cost = document.getElementById('buy_cost');
var build_hours = document.getElementById('build_hours');
var buy_hours = document.getElementById('buy_hours');
var build_total = document.getElementById('build_total');
var build_train = document.getElementById('build_train');
var buy_total = document.getElementById('buy_total');
var time1 = document.getElementById('time1');
var time2 = document.getElementById('time1');
var time3 = document.getElementById('time1');
var time4 = document.getElementById('time1');
var time5 = document.getElementById('time1');
var time6 = document.getElementById('time1');
var time7 = document.getElementById('time1');
var time8 = document.getElementById('time1');
var designhours = document.getElementById('designhours');
// create an empty array to hold error messages
var msg = [];
// check each input value, and add an error message to the array if it's not a number
if (isNaN(wageval)) {
msg.push('Average instructor hourly wage is not a number');
// the value isn't a number
}
if (isNaN(instructorsval)) {
msg.push('Number of instructors per course is not a number');
// the value isn't a number
}
if (isNaN(classval)) {
msg.push('Scenario programming class is not a number');
// the value isn't a number
}
if (isNaN(designhoursval)) {
msg.push('Instruction design hours per scenario is not a number');
// the value isn't a number
}
if (isNaN(costval)) {
msg.push('Average cost of SimStore scenarios is not a number');
// the value isn't a number
}
if (isNaN(manyval)) {
msg.push('How many scenarios do you need is not a number');
// the value isn't a number
}
if (isNaN(hiddenval)) {
msg.push('joe messed up');
// the value isn't a number
}
if (isNaN(time1val)) {
msg.push('Needs Analysis is not a number');
// the value isn't a number
}
if (isNaN(time2val)) {
msg.push('Research is not a number');
// the value isn't a number
}
if (isNaN(time3val)) {
msg.push('Design is not a number');
// the value isn't a number
}
if (isNaN(time4val)) {
msg.push('Scenario Programming is not a number');
// the value isn't a number
}
if (isNaN(time5val)) {
msg.push('Support Materials is not a number');
// the value isn't a number
}
if (isNaN(time6val)) {
msg.push('Validation is not a number');
// the value isn't a number
}
if (isNaN(time7val)) {
msg.push('Revision is not a number');
// the value isn't a number
}
if (isNaN(time8val)) {
msg.push('Implementation is not a number');
// the value isn't a number
}
// if the array contains any values, display an error message
if (msg.length > 0)  {
build_cost.value = msg.join(', ');
buy_cost.value = msg.join(', ');
build_hours.value = msg.join(', ');
build_train.value = msg.join(', ');
build_total.value = msg.join(', ');
buy_total.value = msg.join(', ');
time1.value = msg.join(', ');
time2.value = msg.join(', ');
time3.value = msg.join(', ');
time4.value = msg.join(', ');
time5.value = msg.join(', ');
time6.value = msg.join(', ');
time7.value = msg.join(', ');
time8.value = msg.join(', ');
} else {
designhours.value = (time1 + time2 + time3 + time4 + time5 + time6 + time7 + time8);
build_cost.value = (wageval * designhoursval);
buy_cost.value = (costval * hiddenval);
build_hours.value = (designhoursval * manyval);
build_train.value = (classval * hiddenval);
build_total.value = (wageval * designhoursval * manyval + classval);
buy_total.value = (costval * manyval);
var build_costval = parseInt(build_cost.value) || 0;
var buy_costval = parseInt(buy_cost.value) || 0;
var build_hoursval = parseInt(build_hours.value) || 0;
var build_trainval = parseInt(build_train.value) || 0;
var build_totalval = parseInt(build_total.value) || 0;
var buy_totalval = parseInt(buy_total.value) || 0;
var designhoursval = parseInt(designhours.value) || 0;
}
};
Thanks again for any guidance anyone can give. I'm struggling through all of this.

First of all, no idea what these are for:
var time1 = document.getElementById('time1');
var time2 = document.getElementById('time1');
var time3 = document.getElementById('time1');
var time4 = document.getElementById('time1');
var time5 = document.getElementById('time1');
var time6 = document.getElementById('time1');
var time7 = document.getElementById('time1');
var time8 = document.getElementById('time1');
Then, you only have the element as var in timex.
So the simplest fix is:
designhours.value = time1val + time2val + time3val + time4val + time5val + time6val + time7val + time8val;
instead of:
designhours.value = time1 + time2 + time3 + time4 + time5 + time8 + time7 + time8;
See where you went wrong? You were adding objects (the input fields) together, not their values (that you already had to begin with).
And note, digits in a input field are not numbers but a string.
You also might want to specify a radix with parseInt like parseInt(val,10);
Finally you could re-factor the code quite a bit, this is indeed a bit much (but good on ya for providing useful error-detection).
See this fiddle: http://jsfiddle.net/4nHvc/1/
UPDATE: upon further inspection there is a lot more wrong:
Why are these function local variables set at the end of your function?
var build_costval = parseInt(build_cost.value) || 0;
var buy_costval = parseInt(buy_cost.value) || 0;
var build_hoursval = parseInt(build_hours.value) || 0;
var build_trainval = parseInt(build_train.value) || 0;
var build_totalval = parseInt(build_total.value) || 0;
var buy_totalval = parseInt(buy_total.value) || 0;
var designhoursval = parseInt(designhours.value) || 0;
The very next line of javascript after the first one where you used the wrong variable names (thus adding objects instead of their values) can't work then either:
build_cost.value = (wageval * designhoursval);
Well, if you get the value of the inputfield designhoursval at the start of the code, that field is still empty.. So then when the script executes the above line, what is designhoursval ??? right, empty. If for instance you re-read that value using the last block of 'useless' code WITHOUT the var variable declaration (you declared it already at the start of your function) and place it above that line, then another field of your calculator starts to work:
designhoursval = parseInt(designhours.value) || 0;
build_cost.value = (wageval * designhoursval);
But then.. isn't it easier to first get al the input-values, do the math, then output the values?
See this fiddle, now it almost works: http://jsfiddle.net/4nHvc/2/

update your time values...
var time1 = parseInt(document.getElementById('time1').value);
var time2 = parseInt(document.getElementById('time1').value);
var time3 = parseInt(document.getElementById('time1').value);
var time4 = parseInt(document.getElementById('time1').value);
var time5 = parseInt(document.getElementById('time1').value);
var time6 = parseInt(document.getElementById('time1').value);
var time7 = parseInt(document.getElementById('time1').value);
var time8 = parseInt(document.getElementById('time1').value);
Also, I'm not sure how you wired up your button to your script, so I changed your function...
function doThis() {
and your button...
<input name="calculate" type="button" id="calculate" value="Calculate" onclick="doThis()" />
Those may have been fine in your code, but that part was omitted in your post so check it out. (You can just use an "alert('foo');" to check.)

Develop Reference

JavaScript is the programming language of the Web.

Commas in javascript calculator answer - javascript

Related

How to determine how many years (D/M/Y) left from the Birthday to a certain age in age calculator?

How to get sum of onload inputs

After setInterval( ) on click function will not work...Variable no longer increments

Javascript - check form field value and display error message if value is 0

Pass a field calculation in html to another field in the SAME form

Categories

Resources