Passing input names to javascript fuction.

[effendi]

I have an array for of input names. Input1 , input 2 etc. Can I pass
the input names in a loop like

document.all[input].value="xxxx"

The problem is document.all cannot be used in Safari/firefox, I tried
using document.getElementById but my inputs do have any IDs. is there
any way of accomplishing thsse.?

 

[Evertjan.]

wrote on 10 okt 2006 in comp.lang.javascript:

I have an array for of input names. Input1 , input 2 etc. Can I pass
the input names in a loop like

document.all[input].value="xxxx"

The problem is document.all cannot be used in Safari/firefox, I tried
using document.getElementById but my inputs do have any IDs. is there
any way of accomplishing thsse.?

document.getElementById(inputID)

will work, if you give the inputs an individual id.

However, maybe you like this:

=========================
<input><br>
<input><br>
<input><br>
<input><br>
<input><br>

<script type='text/javascript'>

var inputArray = document.getElementsByTagName("input");
var j = 7;
for (var i in inputArray)
inputArray.value = 'Number: ' + j++;

</script>
=========================

 

[effendi]

wrote on 10 okt 2006 in comp.lang.javascript:

I have an array for of input names. Input1 , input 2 etc. Can I pass
the input names in a loop like

document.all[input].value="xxxx"

The problem is document.all cannot be used in Safari/firefox, I tried
using document.getElementById but my inputs do have any IDs. is there
any way of accomplishing thsse.?

document.getElementById(inputID)

will work, if you give the inputs an individual id.

However, maybe you like this:

=========================
<input><br>
<input><br>
<input><br>
<input><br>
<input><br>

<script type='text/javascript'>

var inputArray = document.getElementsByTagName("input");
var j = 7;
for (var i in inputArray)
inputArray.value = 'Number: ' + j++;

</script>
=========================

Thanks. That's new to me but unfortunately very difficult to implement
as my function generates the input name and it checks the input
repeatedly. My code looks like this at the moment

function processBackground(){ for (n=1;n<11;n++)
{
cellrow="r"+n
for (i=1;i<17;i++){
cell=cellrow+"w"+i
cellName=cell+"_ID"
cellID=cell+"ID"
if (document.all[cell].value=="X"){
document.getElementById(cellName).style.backgroundColor='#84DFC1'
}
}
}
}

I need to change that line with the if statement

Any ideas?

 

[Evertjan.]

wrote on 10 okt 2006 in comp.lang.javascript:

<script type='text/javascript'>

var inputArray = document.getElementsByTagName("input");
var j = 7;
for (var i in inputArray)
inputArray.value = 'Number: ' + j++;

</script>
=========================

Thanks. That's new to me but unfortunately very difficult to implement
as my function generates the input name and it checks the input
repeatedly. My code looks like this at the moment

function processBackground(){ for (n=1;n<11;n++)
{
cellrow="r"+n
for (i=1;i<17;i++){
cell=cellrow+"w"+i
cellName=cell+"_ID"
cellID=cell+"ID"
if (document.all[cell].value=="X"){
document.getElementById(cellName).style.backgroundColor='#84DFC1'
}
}
}
}

I need to change that line with the if statement

You now seem to come with a table "cell"?,
you did not mention before.
A table cell is not an input field.

If it is not a table cell, do not use reserved words, you are bount to
get into trouble.

My advice is forget about the outdated document.all, if you want cross
browser compatibility, and start over again.

If you set your element id's this way, it probably is just as simple to
access those elements directly.

Do some decent indenting, proper var-ing, systemized capitalisation:

function processBackground(){
var cell, cellRow, cellName, cellID;
for (var n=1 ; n<11 ; n++) {
cellRow="r"+n;
for (var i=1 ; i<17 ; i++){
cell = cellRow + "w" + i;
cellName = cell + "_ID";
cellID = cell + "ID";
if (document.all[cell].value == "X"){
document.getElementById(cellName).style.backgroundColor
= '#84DFC1';
};
};
};
};

And change it to [if we are still talking <input>]:

function processBackground(myElement){
var arr = myElement.getElementsByTagName("input");
for (var i in arr)
if (arr.value == "X")
arr.style.backgroundColor = '#84DFC1';
};

if you want to execute this for all <input> in the document, run it as:

processBackground(document);

or for a part:

processBackground(document.getElementById('myContainerDiv'));

Not tested.

 

[effendi]

wrote on 10 okt 2006 in comp.lang.javascript:

<script type='text/javascript'>

var inputArray = document.getElementsByTagName("input");
var j = 7;
for (var i in inputArray)
inputArray.value = 'Number: ' + j++;

</script>
=========================

Thanks. That's new to me but unfortunately very difficult to implement
as my function generates the input name and it checks the input
repeatedly. My code looks like this at the moment

function processBackground(){ for (n=1;n<11;n++)
{
cellrow="r"+n
for (i=1;i<17;i++){
cell=cellrow+"w"+i
cellName=cell+"_ID"
cellID=cell+"ID"
if (document.all[cell].value=="X"){
document.getElementById(cellName).style.backgroundColor='#84DFC1'
}
}
}
}

I need to change that line with the if statement

You now seem to come with a table "cell"?,
you did not mention before.
A table cell is not an input field.

If it is not a table cell, do not use reserved words, you are bount to
get into trouble.

My advice is forget about the outdated document.all, if you want cross
browser compatibility, and start over again.

If you set your element id's this way, it probably is just as simple to
access those elements directly.

Do some decent indenting, proper var-ing, systemized capitalisation:

function processBackground(){
var cell, cellRow, cellName, cellID;
for (var n=1 ; n<11 ; n++) {
cellRow="r"+n;
for (var i=1 ; i<17 ; i++){
cell = cellRow + "w" + i;
cellName = cell + "_ID";
cellID = cell + "ID";
if (document.all[cell].value == "X"){
document.getElementById(cellName).style.backgroundColor
= '#84DFC1';
};
};
};
};

And change it to [if we are still talking <input>]:

function processBackground(myElement){
var arr = myElement.getElementsByTagName("input");
for (var i in arr)
if (arr.value == "X")
arr.style.backgroundColor = '#84DFC1';
};

if you want to execute this for all <input> in the document, run it as:

processBackground(document);

or for a part:

processBackground(document.getElementById('myContainerDiv'));

Not tested.

Thanks I tried the getElementsbyId before posting the last one and it
didnt work maybe I will try again. Anyway, I had fields in a table. I
change the colour of the table cells based on the value in the field.

 

[RobG]

Is there supposed to be an underscore there?

cellID=cell+"_ID"

if (document.all[cell].value=="X"){
document.getElementById(cellName).style.backgroundColor='#84DFC1'

Here you are using the variable 'cellName' for what should be an ID
attribute, yet your code above seems to set the name and ID with
different values - or is the missing underscore an error?

[...]

Thanks I tried the getElementsbyId before posting the last one and it
didnt work maybe I will try again. Anyway, I had fields in a table. I
change the colour of the table cells based on the value in the field.

Then you should probably be using onchange (and therefore don't need to
know the input's id or name) rather than continuously checking the
values of the fields.

Otherwise, as suggested by Evertjan, get references to the inputs once
and store them in an array or object. Then you just iterate over the
array each time you want to check the inputs - it is much faster and
more efficient than re-generating IDs and using getElementById every
time.

 

[Evertjan.]

wrote on 11 okt 2006 in comp.lang.javascript:

Thanks I tried the getElementsbyId before posting the last one and it
didnt work maybe I will try again.

Please stop saying "didn't work", without explaining what happenend and if
an error [what error?] was generated, and a piese of code, showing the
problem. We in this NG cannot help "didn't work".

Anyway, I had fields in a table. I
change the colour of the table cells based on the value in the field.

A <td>...</td> has no "value" but an "innerHTML".
Do not use those terms loosely.

In a table, you can use "cells"

Be advised that testing on the whole content of a <td>
can give unexpected results with extra spaces,
so use a regex //.test(), much more flexible:

============

<table id='myTable' border=1><tr>
<td>A</td>
<td>X</td>
<td>A</td>
<td>Fax</td>
</tr></table>

<script type='text/javascript'>

function processBackground(myElement){
var arr = myElement.cells;
for (var i in arr)
if (/x/i.test(arr.innerHTML))
arr.style.backgroundColor = '#84DFC1';
};

processBackground(document.getElementById('myTable'));
// processBackground(document.getElementById('myOtherTable'));

</script>

==============

IE6 tested