Forum Moderators: open

Message Too Old, No Replies

Set select menu's option values to text input values?

Almost works, but can't set i to 0, only 1?

         

JAB Creations

7:33 pm on May 12, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



This almost works however I can't seem to start the script with i set to 0.

Each val_# id should have it's value equal the relative number of the select menu's value.

So in the following situation...
val_1 = 1
val_2 = 2
val_3 = 3

...however at best the script below sets it to...
val_1 = 2
val_2 = 3
val_3 = 4

Here is what I currently have...

- John

<html>
<head>
<script>
function my_function() {

for (var i=1; i<document.getElementById('my_select').length; i++) {
document.getElementById('val_'+i).value = document.getElementById('my_select')[i].value;
}
}
function start() {
my_function();
}
window.onload = start;
</script>
</head>

<body>

<select id="my_select">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
</select>
<br />
<input id="val_1" type="text" value="" />
<input id="val_2" type="text" value="" />
<input id="val_3" type="text" value="" />
<input id="val_4" type="text" value="" />
<input id="val_5" type="text" value="" />
<input id="val_6" type="text" value="" />
<input id="val_7" type="text" value="" />
</body>
</html>

JAB Creations

9:14 pm on May 12, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Can any one explain how I can correctly reference the usage of the child parenthesis inside of getElementById for future references? The code below works fine now...
<html>
<head>
<script>
function my_function() {

for(var i=0; i<document.getElementById('my_select').length; i++){
document.getElementById('val_' + (i+1)).value = document.getElementById('my_select')[i].value;
}
}

function start() {
my_function();
}
window.onload = start;
</script>
</head>

<body>

<a href="javascript:my_alert();">index?</a>

<select id="my_select">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
</select>
<br />
<input id="val_1" type="text" value="" />
<input id="val_2" type="text" value="" />
<input id="val_3" type="text" value="" />
<input id="val_4" type="text" value="" />
<input id="val_5" type="text" value="" />
<input id="val_6" type="text" value="" />
<input id="val_7" type="text" value="" />
</body>
</html>

Fotiman

10:17 pm on May 12, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



document.getElementById('my_select')[i].value

Should be:

document.getElementById('my_select').options[i].value