Writing from one form to another

Question

I have two forms.

Form A has three text input; A1, A2, A3. Form B has one text input, B1.

Whenever you type in any of the inputs on Form A, Form B should get updated, right away, with all three inputs from Form A. If one of the Form A inputs is empty, a 0 should replace it in B1.

For example, if I'm typing "test" in A1 and leave A2 and A3 empty, B1 should reflect: test+0+0. If I'm typing "test" in A1 and "help" in A2, and leave A3 empty, then B1 should reflect: test+help+0

Can anyone assist with this? I have very limited experience with Javascript so I'm not even sure how to search for such aspects of this feature. Can someone point me in the right direction?

Answer 1

A start, using prototype.js

function build_b() {
    var str = "";
    str += "A1=" + ($F('A1') == ''? '0' : $F('A1'));
    str += "A2=" + ($F('A2') == ''? '0' : $F('A2'));
    str += "A2=" + ($F('A3') == ''? '0' : $F('A3'));
    $('B').value = str;
}

This assumes that the element ID's are A1, A2, A3 and B. Bind this function to the 'onchange' event of A1, A2 and A3.

Answer 2

Add a method to the onChange event of each input on the A form such as: onChange=populateBField();

Function populateBField(){
 document.formB.B1.value = getFieldContents("A1") + "+" + getFieldContents("A2") 
 + "+" + getFieldContents("A3");
}

function getFieldContents(fieldName){
   var fieldValue = document.formA.fieldName.value;
   // if no value is entered, set to 0
   if (fieldValue.length < 1){
       fieldValue = 0;
   }
   return fieldValue;
}

Please point out any errors/improvements as I'm a relative JS newbie myself :)

Answer 3

you guys are good. thank you very much. i was able to use the code provided to do exactly what i needed. cheers!