Javascript to sum values

[rk68]

Hi,

I'm new to javascript & working on PHP where in I have 15 rows & multiple columns
The below function is to calculate the row wise multiplication

The screen will look something like this:
stock price value
1) 12 4 48
2) 11 5 55
.
.
15) 10 6 60
-----
Total 163

The value is getting populated by the below function.
What I need is how can i incorporate the total i.e. 163 within this function.
----------------------------------------
function multopst() {
var opst = ['vops1','vops2','vops3','vops4','vops5','vops6','vops7','vops8','vops9','vops10','vops11','vops12' ,'vops13','vops14','vops15'];
var lprc = ['vlpr1','vlpr2','vlpr3', 'vlpr4', 'vlpr5', 'vlpr6', 'vlpr7', 'vlpr8', 'vlpr9', 'vlpr10', 'vlpr11', 'vlpr12', 'vlpr13', 'vlpr14', 'vlpr15'];
var opval = ['vvops1','vvops2','vvops3','vvops4','vvops5','vvops6','vvops7','vvops8','vvops9','vvops10','vvops11','vvops12','vvops13','vvops14','vvops15'];

for (var index = 0; index < opst.length; index++)
{
var myBox1 = document.getElementById(opst[index]).value;
var myBox2 = document.getElementById(lprc[index]).value;
var result = document.getElementById(opval[index]);
var val01 = myBox1 * myBox2;
result.value = val01;
};
};
----------------------------------------------------------------
TIA,
Raj

 

[feherke]

Hi

I would try this first :

[b]function[/b] [COLOR=orange]multopst[/color][teal]()[/teal]
[teal]{[/teal]
    [b]var[/b] opst [teal]= [[/teal][i][green]'vops1'[/green][/i][teal],[/teal][i][green]'vops2'[/green][/i][teal],[/teal][i][green]'vops3'[/green][/i][teal],[/teal][i][green]'vops4'[/green][/i][teal],[/teal][i][green]'vops5'[/green][/i][teal],[/teal][i][green]'vops6'[/green][/i][teal],[/teal][i][green]'vops7'[/green][/i][teal],[/teal][i][green]'vops8'[/green][/i][teal],[/teal][i][green]'vops9'[/green][/i][teal],[/teal][i][green]'vops10'[/green][/i][teal],[/teal][i][green]'vops11'[/green][/i][teal],[/teal][i][green]'vops12'[/green][/i] [teal],[/teal][i][green]'vops13'[/green][/i][teal],[/teal][i][green]'vops14'[/green][/i][teal],[/teal][i][green]'vops15'[/green][/i][teal]];[/teal]
    [b]var[/b] lprc [teal]= [[/teal][i][green]'vlpr1'[/green][/i][teal],[/teal][i][green]'vlpr2'[/green][/i][teal],[/teal][i][green]'vlpr3'[/green][/i][teal],[/teal] [i][green]'vlpr4'[/green][/i][teal],[/teal] [i][green]'vlpr5'[/green][/i][teal],[/teal] [i][green]'vlpr6'[/green][/i][teal],[/teal] [i][green]'vlpr7'[/green][/i][teal],[/teal] [i][green]'vlpr8'[/green][/i][teal],[/teal] [i][green]'vlpr9'[/green][/i][teal],[/teal] [i][green]'vlpr10'[/green][/i][teal],[/teal] [i][green]'vlpr11'[/green][/i][teal],[/teal] [i][green]'vlpr12'[/green][/i][teal],[/teal] [i][green]'vlpr13'[/green][/i][teal],[/teal] [i][green]'vlpr14'[/green][/i][teal],[/teal] [i][green]'vlpr15'[/green][/i][teal]];[/teal]
    [b]var[/b] opval [teal]= [[/teal][i][green]'vvops1'[/green][/i][teal],[/teal][i][green]'vvops2'[/green][/i][teal],[/teal][i][green]'vvops3'[/green][/i][teal],[/teal][i][green]'vvops4'[/green][/i][teal],[/teal][i][green]'vvops5'[/green][/i][teal],[/teal][i][green]'vvops6'[/green][/i][teal],[/teal][i][green]'vvops7'[/green][/i][teal],[/teal][i][green]'vvops8'[/green][/i][teal],[/teal][i][green]'vvops9'[/green][/i][teal],[/teal][i][green]'vvops10'[/green][/i][teal],[/teal][i][green]'vvops11'[/green][/i][teal],[/teal][i][green]'vvops12'[/green][/i][teal],[/teal][i][green]'vvops13'[/green][/i][teal],[/teal][i][green]'vvops14'[/green][/i][teal],[/teal][i][green]'vvops15'[/green][/i][teal]];[/teal]
    [highlight][b]var[/b] total [teal]=[/teal] [purple]0[/purple][teal];[/teal][/highlight]

    [b]for[/b] [teal]([/teal][b]var[/b] index [teal]=[/teal] [purple]0[/purple][teal];[/teal] index [teal]<[/teal] opst[teal].[/teal]length[teal];[/teal] index[teal]++)[/teal]
    [teal]{[/teal]
        [b]var[/b] myBox1 [teal]=[/teal] document[teal].[/teal][COLOR=orange]getElementById[/color][teal]([/teal]opst[teal][[/teal]index[teal]]).[/teal]value[teal];[/teal]
        [b]var[/b] myBox2 [teal]=[/teal] document[teal].[/teal][COLOR=orange]getElementById[/color][teal]([/teal]lprc[teal][[/teal]index[teal]]).[/teal]value[teal];[/teal]
        [b]var[/b] result [teal]=[/teal] document[teal].[/teal][COLOR=orange]getElementById[/color][teal]([/teal]opval[teal][[/teal]index[teal]]);[/teal]
        [b]var[/b] val01 [teal]=[/teal] myBox1 [teal]*[/teal] myBox2[teal];[/teal]
        result[teal].[/teal]value [teal]=[/teal] val01[teal];[/teal]
        [highlight]total [teal]+=[/teal] val01[teal];[/teal][/highlight]
    [teal]};[/teal]

    [highlight]document[teal].[/teal][COLOR=orange]getElementById[/color][teal]([/teal][i][green]'[/highlight][highlight pink]id_of_your_total[/highlight][highlight]'[/green][/i][teal]).[/teal]value [teal]=[/teal] total[teal];[/teal][/highlight]
[teal]};[/teal]

If it not does what you expected, then you will have to provide more details of the task.

Feherke.
feherke.ga

 

[rk68]

Thanks Feherke. It did work.

Except for "document.getElementById('id_of_your_total').value = total", I used $("#vtopsv1").html(topval);
because the field is in SPAN.

One more help I need to to calculate 2 fields & the result should come in the 3rd field

Sub total: 22
Discount: 11
Grand Total: 33

The sub-total comes from the function I had mentioned in my post & you helped me.
Discount field will be an input field where the user will be entering some value
Grand total has to come automatically thru a script.

I had worked on a script (given below) but showing no result. Is there a way to do so.
-------------------------------
function ttot() {

var opq1 = document.getElementById('vtopsq1').value;
var opq2 = document.getElementById('vtopsq2').value;
var opq3 = parseInt(opq1) + parseInt(opq2);
if (!isNaN(opq3)) {
$("#vtopsq3").html(opq3);
}
}
----------------------------------------

TIA,
Raj

 

[feherke]

Hi

Something is not clear. From your words I understood that you want to add a value coming either from a [tt]span[/tt] tag or a variable and value from an [tt]input[/tt] field. But in your code you are trying to get both values from [tt]input[/tt] fields. So, what king of HTML elements are #vtopsq1 and #vtopsq2 ?

Feherke.
feherke.ga

 

[rk68]

Thanks for quick response.

subtotal = vtopsq1 (data is populated from another function)
discount = vtopsq2 (input by the user)
grand total = vtopsq3 ( this will sum of the above 2 fields).

Below is HTML code for the above mentioned fields

<td align="right"><span class="style34" id="vtopsq1"></span></div></td>
<td><span class="style34"><input id ="vtopsq2" style="text-align: right;" size="6" name ="vtopsq2" maxlength="7"/></span></div></td>
<td align="right"><span class="style34" id ="vtopsq3"></span></div></td>

 

[feherke]

Hi

Well, if #vtopsq1 is a [tt]span[/tt] element, it has no [tt]value[/tt] attribute. The closest equivalent DOM property would be [tt]textContent[/tt] :

[b]function[/b] [COLOR=orange]ttot[/color][teal]()[/teal]
[teal]{[/teal]
    [b]var[/b] opq1 [teal]=[/teal] document[teal].[/teal][COLOR=orange]getElementById[/color][teal]([/teal][i][green]'vtopsq1'[/green][/i][teal]).[/teal][highlight]textContent[/highlight][teal];[/teal]
    [b]var[/b] opq2 [teal]=[/teal] document[teal].[/teal][COLOR=orange]getElementById[/color][teal]([/teal][i][green]'vtopsq2'[/green][/i][teal]).[/teal]value[teal];[/teal]
    [b]var[/b] opq3 [teal]=[/teal] [COLOR=orange]parseInt[/color][teal]([/teal]opq1[teal]) +[/teal] [COLOR=orange]parseInt[/color][teal]([/teal]opq2[teal]);[/teal]
    [b]if[/b] [teal](![/teal][COLOR=orange]isNaN[/color][teal]([/teal]opq3[teal])) {[/teal]
        $[teal]([/teal][i][green]"#vtopsq3"[/green][/i][teal]).[/teal][COLOR=orange]html[/color][teal]([/teal]opq3[teal]);[/teal]
    [teal]}[/teal]
[teal]}[/teal]

Note that [tt]textContent[/tt] is supported in Explorer only since version 9. As jQuery also supports Explorer only since version 9, its equivalent [tt].text()[/tt] method is similarly useless if you intend to support older Explorer too. In that case either use the [tt]innerHTML[/tt] DOM property, or the same [tt].html()[/tt] jQuery method as you already used, but this time as getter ( without parameter ).


Feherke.
feherke.ga