Complex Javascript Array - sum values and insert value into form
Trying to adapt a rather complex array code. Basically, I want to add the total hours entered, then return the value into input name="total_hrs", but got stuck! Would also appreciate any help to simplify/clean up the script! Thanks. Here's the script:
Quote:
<script language="JavaScript" type="text/javascript">
<!--
function subCalc(the_form)
{
var subtotal = 0;
var subtemp = 0;
var totalHrs = 0;
// put the calories and form fields into parallel arrays.
var calorie_array = new Array()
calorie_array[0] = 72;
calorie_array[1] = 86;
calorie_array[2] = 100;
calorie_array[3] = 126;
calorie_array[4] = 130;
calorie_array[5] = 180;
calorie_array[6] = 156;
calorie_array[7] = 182;
calorie_array[8] = 210;
calorie_array[9] = 250;
calorie_array[10] = 270;
calorie_array[11] = 390;
calorie_array[12] = 390;
calorie_array[13] = 546;
for(i = 0; i < calorie_array.length; i++)
{
// Give subtemp the value or the calorie times the time.
subtemp = (calorie_array[i] * time_array[i].value);
// Put the converted string into the form field.
sub_array[i].value = checkAmount(subtemp);
// Add the converted number value to subtotal.
subtotal += roundFloat(subtemp);
function roundFloat(num) {
num = parseFloat(num);
num = Math.round(100*num)/100
return num
}
function checkAmount(num) {
// Convert into a floating point number.
num = parseFloat(num)
// Round the number off.
num = Math.round(100*num)/100
// Turn into a string.
num = String(num)
// Return the converted string.
return num
}
Here's how I would do it. Note that by making your field names more readable you make it easier to give a readable error message when bad values are input.
Code:
<html>
<head>
<script type="text/javascript">
function totalCalc( form )
{
var activities = {
sleeping : 72,
TV : 86,
sitting : 100,
cooking : 126,
standing : 130,
washing : 180,
walking_slowly : 156,
housework : 182,
walking_medium : 210,
gardening : 250,
dancing : 270,
stairs : 390,
jogging : 390,
squash : 546
}
var totalTime = 0;
var totalCalories = 0;
var badFields = [ ];
for( var act in activities )
{
// get time corresponding to each calories value:
var fld = form[act + "_time"];
var time = fld.value;
if ( isNaN(time) )
{
badFields.push( act );
fld.value = "**INVALID**"; // OPTIONAL
time = 0;
}
time /= 60; // convert to hours
totalTime += time ;
var calories = activities[act] * time;
totalCalories += calories;
form[act + "_calories"].value = calories.toFixed(0);
}
form.total_hrs.value = totalTime.toFixed(2);
form.total.value = totalCalories.toFixed(0);
var msg = "";
if ( badFields.length > 0 ) { msg = "Invalid fields: " + badFields; }
document.getElementById("OOPS").innerHTML = msg;
}
</script>
</head>
<body>
<form id="calc_form">
Enter your times spent at each activity IN MINUTES:<hr/>
Sleeping: <input name="sleeping_time"> <input readonly name="sleeping_calories" size="2"><br/>
TV: <input name="TV_time"> <input readonly name="TV_calories" size="2"><br/>
sitting: <input name="sitting_time"> <input readonly name="sitting_calories" size="2"><br/>
cooking: <input name="cooking_time"> <input readonly name="cooking_calories" size="2"><br/>
standing: <input name="standing_time"> <input readonly name="standing_calories" size="2"><br/>
washing: <input name="washing_time"> <input readonly name="washing_calories" size="2"><br/>
walking slowly: <input name="walking_slowly_time"> <input readonly name="walking_slowly_calories" size="2"><br/>
housework: <input name="housework_time"> <input readonly name="housework_calories" size="2"><br/>
walking medium: <input name="walking_medium_time"> <input readonly name="walking_medium_calories" size="2"><br/>
gardening: <input name="gardening_time"> <input readonly name="gardening_calories" size="2"><br/>
dancing: <input name="dancing_time"> <input readonly name="dancing_calories" size="2"><br/>
stairs: <input name="stairs_time"> <input readonly name="stairs_calories" size="2"><br/>
jogging: <input name="jogging_time"> <input readonly name="jogging_calories" size="2"><br/>
playing squash: <input name="squash_time"> <input readonly name="squash_calories" size="2"><br/>
<hr/>
<span id="OOPS" style="color: red; font-weight: bold;"></span><br/><br/>
Total hours: <input readonly name="total_hrs"/><br/>
Total calories: <input readonly name="total"/><br/>
<hr/>
<input type="button" value="calculate" onclick="totalCalc(this.form)"/>
</form>
</body>
</html>
__________________
An optimist sees the glass as half full.
A pessimist sees the glass as half empty.
A realist drinks it no matter how much there is.
Thanks Old Pedant, code looks a lot simpler now, but after trying it's not calculating correctly. Each variable is based on time, activity and a set value. The kcals bit was working ok, but isn't now. The hours is now working in your code but isn't adding up correctly e.g. 1 + 2 hrs is giving a result of 0.05?
Also, kill your roundFloat() and checkAmount() functions. They aren't doing anything useful that can't be done simpler.
Just removed roundFloat() and checkAmount() functions and it doesn't work as these are linked to by:
// Adds total hours.
hours = totalHrs
form.total_hrs.value = checkAmount(hours);
Just removed roundFloat() and checkAmount() functions and it doesn't work as these are linked to by:
// Adds total hours.
hours = totalHrs
form.total_hrs.value = checkAmount(hours);
(in place of your way-overkill checkAmount() code).
Thanks - I know the script is a bit extensive! That's why I got stuck - I'm not an expert - just trying to adapt it! Could you simplify it so it is shorter as there are scrpits passing through scripts....
Hi,
Thought about that, but the calorie ratios are based on hours of activities.
Thanks.
Yes. I know. And that's why, *BEFORE* I multiply the time by the number of calories per hour, I *FIRST DIVIDE BY 60* to convert the minutes into hours.
But as I said, if you want to stick with hours just remove the ONE LINE that I indicated (and of course change the message).
__________________
An optimist sees the glass as half full.
A pessimist sees the glass as half empty.
A realist drinks it no matter how much there is.
Could you simplify it so it is shorter as there are scrpits passing through scripts....
Ummm...I *THOUGHT* that was what I did in my post #3.
Did you actually *TRY* that code???
The HTML isn't as pretty as yours, but it works. I really did test it, you know.
Oh...what the heck. Here. I've add the ability to choose to use hours or minutes. And I've put it online to prove it works. http://mywhizbang.com/calories.html
You can VIEW-->>SOURCE that page to see the updated code.
__________________
An optimist sees the glass as half full.
A pessimist sees the glass as half empty.
A realist drinks it no matter how much there is.
Before you post, read our: 
