Repetitive Code

AustInsane posted this at 20:16 — 23rd March 2011.

They have: 2 posts

Joined: Mar 2011

I'm just learning javascript, but I'm repeating the same function over and over with only a number changed to identify it uniquely so that each function will work with a different form.

function valAdd1()      {
     document.myForm1.addpts.value=Number(myForm1.addpts.value) + Number(1)
}
function valSubtract1()      {
     document.myForm1.addpts.value=Number(myForm1.addpts.value) - Number(1)
}
function valAdd2()      {
     document.myForm2.addpts.value=Number(myForm2.addpts.value) + Number(1)
}
function valSubtract2()      {
     document.myForm2.addpts.value=Number(myForm2.addpts.value) - Number(1)
}
function valAdd3()      {
     document.myForm3.addpts.value=Number(myForm3.addpts.value) + Number(1)
}
function valSubtract3()      {
     document.myForm3.addpts.value=Number(myForm3.addpts.value) - Number(1)
}

etc.
Is there any way to shrink this down to one function with all the different numbers entered in one place or something? Or alternatively some way to make different forms activate the same function. It doesn't work if there are 2 forms with the same name.

teammatt3 posted this at 02:40 — 4th April 2011.

He has: 2,102 posts

Joined: Sep 2003

You could create a function that takes the amount to adjust by and the form id number:

function changePtsOnForm(amount, form_id){
    var form_field = document['myForm' + form_id].addpts;
    form_field.value = Number(form_field.value) + amount;
}

Then you can call it like:

changePtsOnForm(1, 1); 
changePtsOnForm(-1, 1);

If you posted some of your HTML (where these JavaScript functions are called), I could probably simplify the code even more.

AustInsane posted this at 03:00 — 4th April 2011.

They have: 2 posts

Joined: Mar 2011

I finally solved the problem with getElementsByName, but thank you.

function valAdd()      {
      var e=document.getElementsByName("addpts");

 for(var i=0;i<e.length;i++){e[i].value = Number(e[i].value) + Number(1);}
}
function valSubtract()      {
      var e=document.getElementsByName("addpts");

 for(var i=0;i<e.length;i++){e[i].value = Number(e[i].value) - Number(1);}
}

"addpts" is the field I was trying to change in each form. The only problem is that it changes the addpts field in all forms instead of the particular form I'm trying to tweak. It still works though.

webwiz posted this at 04:26 — 5th April 2011.

He has: 629 posts

Joined: May 2007

Note - The getElementsByName method works differently in different browsers.

In Internet Explorer and Opera, it searches and returns the elements matched by id and name attributes.
In Firefox, Google Chrome and Safari, only elements with matching name attributes are returned.

- Another difference is case-sensitivity.

In Firefox, Opera, Google Chrome and Safari, the getElementsByName method is case-sensitive for the value of the name (and the id in Opera) attribute.
In Internet Explorer, it is not case-sensitive for the value of the id and name attributes.

Cordially, David
--
delete from internet where user_agent="MSIE" and version < 8;