Field Calculations with Scope

[pimpmaster]

Howdy, Scripters :)

Im trying to update fields and dom elements based on form inputs:

[HTML]<form action="whateve r">
<fieldset class="calc">
<input type="text" class="charge" />
<input type="text" class="cost" />
<input type="text" class="profit" />
</fieldset>
</form>
[/HTML]

Basically I want to take whatever the user types into the charge field and subtract their cost input, the sum would populate the profit input instantly.

Of course, the fun is just beginning :)

Underneath this form, I have a javascript link which clones the fieldset, so I get another batch of inputs to play with. Due to this, the calculations need to happen within the scope of each "fieldset.c alc"

The icing on the cake is that I need to grab the values of all the inputs on the page of a certain class, sum them up and display them inside a designated div. Something like getElementsbyCl assname perhaps?

I'm not really sure where to begin so any advice would be huge.

Thanks in advance,

PM

[gits]

hi ...

i think you could use getElementsByTa gName('fieldset '); that gives you the list of all fieldsets ... now check every nodes class and retrieve the input-values in a node where class == 'calc' ... and perform the calculation ...

post what code you have so far ... in case you have problems to implement that suggestions

kind regards

[pimpmaster]

Hi Gits :)

Thanks for your reply. I have posted my code here:

1. No matter which way I try, the calculations only work within the scope of a form.

2. I'd like to use innerHTML instead of inputs for the "each" fields, but cant get that working

3. Totally lost on how to clone the entire table

Any ideas?

[gits]

ok ... that's a bunch of things to do ... lets fix and adapt it all step by step, first we handle the clone-node issue ...

adapt your clone_it() function to that and tell whether this works as intended:

[CODE=javascript]function clone_it(id) {
var node = document.getEle mentById(id).cl oneNode(true);
var base = document.getEle mentsByTagName( 'a')[0];
document.getEle mentsByTagName( 'body')[0].insertBefore(n ode, base);
}
[/CODE]
kind regards

[pimpmaster]

cheers gits!

It does clone as expected, but there is one issue. If I fill out the fields and then clone, the field values are also filled in for the clone. I need for the new copy to be a clean slate.

I tried cloneNode(false ) but that does nothing

Another problem is that my calculations only work on the original copy of the form.

Odd

[gits]

as i said :) ... step by step ... i have to go to sleep first ... lets have a look tomorrow ... we could clean up the fields during the clone-operation ... and add the calc-funcs ... but its late now :) ...

kind regards