Log in

View Full Version : select option.value to input with same number, almost works!


JAB Creations
05-12-2008, 08:12 PM
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 with the select option values in mind I want to have the following...
val_1 = 1 (the select menu's first option's value)
val_2 = 2 (the select menu's second option's value)
val_3 = 3 (etc...)

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

Here is what I currently have...


<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>

<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>
JAB Creations
05-12-2008, 09:14 PM
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>
Master_script_maker
05-12-2008, 09:15 PM
So in the following situation with the select option values in mind I want to have the following...
val_1 = 1 (the select menu's first option's value)
val_2 = 2 (the select menu's second option's value)
val_3 = 3 (etc...)
actually, the first select value is 0, like in an array. to solve this you would do this:

function my_function() {
for(var i=1; i<document.getElementById('my_select').length; i++)
{
document.getElementById('val_' + i).value = document.getElementById('my_select')[i-1].value;
}
}
Edit:
sorry, posted at the same time.
Edit 2:
while looking over your code, i found an error:

for(var i=0; i<document.getElementById('my_select').length; i++){
document.getElementById('val_' + (i+1)).value = document.getElementById('my_select')[i].value;
}
the correct way to do this would be:

for(var i=0; i<document.getElementById('my_select').length; i++){
document.getElementById('val_' + (i+1)).value = document.getElementById('my_select').options[i].value;
}
JAB Creations
05-12-2008, 09:18 PM
It's ok. :cool:

01010100010110010101011001001101!