caculating values in JavaScript

[neil1]

please see the script below

<SCRIPT LANGUAGE="JavaScript">
function calculate() {
    var total = 0;
 
    for (var i = 1; i < arguments.length; i++) {
        total += parseInt(arguments[i].value, 10);
    }
 
    document.forms.myForm._1_1_82_1.value = total;
 
</SCRIPT>
<input type="button" value="Time lost to weather" onclick="calculate(0, this.form._1_1_44_1_84_1, this.form._1_1_44_1_101_1, this.form._1_1_44_1_102_1, this.form._1_1_44_1_106_1, this.form._1_1_44_1_110_1);">
 
</FORM>

this work fine if i click on the time lost to weather button, but want i would like to do is either poplulate the vaule dynamically or when i submit the form

can any one help

[Dormilich]

your function call ( in <input>) is totally useless, because you don’t read the values in the function (besides that they are defined wrong).

and I can’t make sense of your problem description.

[neil1]

sorry

Does this make more sense

basically i when i submit the form i would like a caculation to run and put the vaule in total field

My Script

<script type="text/javascript">
function calculate() {
    var total = 0;
 
    for (var i = 1; i < arguments.length; i++) {
        total += parseInt(arguments[i].value, 10);
    }
 
    document.forms.myForm.myTotal.value = total;
}
</script>
 
<FORM NAME="myForm" >
<input type="button" value="Calculate" onclick="calculate(0, this.form.myFld1, this.form.myFld2, this.form.myFld3,this.form.myFld4, this.form.myFld5);">
 
 
<INPUT NAME="myFld1" TYPE="text" VALUE=""></INPUT>+
<INPUT NAME="myFld2" TYPE="text" VALUE=""></INPUT>+
<INPUT NAME="myFld3" TYPE="text" VALUE=""></INPUT>+
<INPUT NAME="myFld5" TYPE="text" VALUE=""></INPUT>+
<INPUT NAME="myFld4" TYPE="text" VALUE=""></INPUT>=
 
<INPUT NAME="myTotal" TYPE="text" VALUE=""></INPUT>
</FORM>
 
</html>
 

[neil1]

Has anyone got any ideas on my issue ?

[zorgi]

Here is friendly jQuery solution:

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(function(){
           $("form > input:button").click(function(event){
                        var total = 0;
                        $("form > input:not(:button)").each(function(){
                                                    if(this.name != 'myTotal'){total = total + parseInt(this.value);}                                    
                                                })
                        $("form > input[name$='myTotal']").value(total);                            
                    })
          })    
</script>
 

However you do need to remove onclick sausage (onclick="calculate(0, this.form.myFld1, this.fo........) and download jQuery.

[gits]

basicly the shown code in post is ok - the function uses the arguments parameter to iterate through the passed values. now to the submit - you might add the submit() to the calculation funtion or use the form's onsubmit handler ...

for such a basic and simple task i wouldn't suggest to use a lib like jQuery (which for such a purpose is certainly just overhead) ... it might be useful when you have more JavaScript tasks for that app ...

kind regards

[zorgi]

@gits
True.

Its 100% overkill but I just like using it. I just like the idea of getting anything on the page easy and without worry if it works in all browsers. I only know basics of javascript. I gave up on it ages ago when I came across first cross browser compatibility issues. Php saved the day. I started doing everything in php (or as much as i could) but with jQuery javascript is fun again and I do what I do firstly cos its fun :)))

[neil1]

Hi Gits

I am new to Java can you please expain in more detail where i would need to add the submit or how i would use the forms onsubmit handler

[gits]

btw. JavaScript has very less to do with Java ...

just add the form-submit after your calculation ... in the function you have written.

kind regards

[neil1]

Git

can you give me any examples

any help would be appericate

[gits]

?? ... did you have had a look at the link i showed above? ... the submit could be triggered by the submit() method of a form ... in your case it should look like:

document.forms.myForm.submit();

kind regards

[neil1]

function calculate() { 
    var total = 0; 
 
    for (var i = 1; i < arguments.length; i++) { 
        total += parseInt(arguments[i].value, 10); 
    } 
 
    document.forms.myForm.myTotal.value = total; 
    document.forms["myform"].submit();

it this where it should put in my my script then ?

[larztheloser]

function calculate() { 
    var total = 0; 
 
    for (var i = 1; i < arguments.length; i++) { 
        total += parseInt(arguments[i].value, 10); 
    } 
 
    document.forms.myForm.myTotal.value = total;
    return true;
}
 

Worked for me. I also got rid of the initial zero in the call to calculate() cause it's redundant, then made i==0 at the start of your FOR loop. Just good coding practice not to have redundant arguments.

[neil1]

larztheloser

where in your code are you saying caculate onsubmit i can get it to work if i created a onclick button, but would like this to be done automatcally

[larztheloser]

No - you make a submit button! Then in the form tag make sure that the action for onsubmit is "calculate();". Now it should all work automatically. The return true submits the form.

[neil1]

have you got any examples of how you would do this as i am new to Java scripts

any help you can give me would be great

[larztheloser]

Making a submit button is HTML code.

Navigate to the form tag. Add this to the end: onsubmit="calculate();".

That's about all (: