for (var s in i) question

spacey

01-28-2005, 10:24 AM

Hello All,
Hopefully somebody here can offer a little guidance.

What i’m trying to achieve:
I'd like to be able to use a combo box to change lots of values on my webpage. Due to the large amount of items to update on the page I was going to store the items in a JavaScript hash.

Then use an “onchange” routine to find the selected item in the combo and just do a simple
for (var x in SELECTEDHASHNAME). Unfortunately due to the combo box storing the selection as a string I can’t simply refer to it in the above statement by name. I’m guessing it has to be converted from string to an object reference. Although I could be way of the mark with this thought?

So back to the question...
Can you use a combo box to refer to the name of a hash that you can then interrogate with a "for x in hash" stile statement?

Hopefully somebody here will understand my ramblings and have a suggestion.
Thanks to one and all for any help they maybe able to offer.
Gareth

Ps. I have attached some sample code that shows what I want to do. If you substitute the “i" for “Mon” it will work.
Likewise I’d want to be able to substitute the Mon[s] for i[s] to make it truly dynamic.

<html>
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script>

function changedata()
{
var Sun = new Object();
var Mon = new Object();
var i;

Sun.User ='UserA';
Mon.User ='UserB';
Mon.Price ='£5';

pp=document.all["dayid"];
for(m=0;m<pp.options.length;m++)
{
if(pp.options[m].selected==true)
{
i=pp.options[m].value;

alert(i);

for (var s in i) //replace i with Var Mon and it works ...pesky thing grr
{
alert('Key=' + s);
document.all[s].innerText = Mon[s] ; //would also need to change Mon to 'i' here
}
break;

}
}

}

</script>
</head>

<body bgcolor="#FFFFFF" text="#000000">
<form name="form1" method="post" action="">

<select id = "dayid" name="days" onchange="changedata();">
<option value="Sun" selected>Sun</option>
<option value="Mon">Mon</option>
<option value="Tue">Tue</option>
<option value="Wed">Wed</option>
<option value="Thu">Thu</option>
<option value="Fri">Fri</option>
<option value="Sat">Sat</option>
</select>

<p id=User>Select an option from the combo box above</p>
<p id=Price>Price</p>

</form>
</body>
</html>

Kor

01-28-2005, 10:46 AM

the options can be refered also by index. so that you may use selectedIndex attribute (it is a select's attribute) as an index to pickup a certain element from an array

var sIndex = document.forms[0].elements['selectname'].selectedIndex
--// where selectedIndex is returned as a number, starting from 0.

myArray[sIndex]

spacey

01-28-2005, 11:16 AM

Thanks for the info but i think iv have missed the point?

var sIndex = document.forms[0].elements['dayid'].selectedIndex

Dose indeed give me the Item number but I did not think you could have a JavaScript hash as a number thought it had to be 'Text-Name-Something'
Or put another way i could not interrogate it as a number :(

If im being stupid here sorry but as with all newbie’s we don’t know better until told :)

Kor

01-28-2005, 11:31 AM

I am not quite sure what is your need...

To get the option's value

var sIndex = document.forms[0].elements['selectname'].selectedIndex;
var optionsvalue = document.forms[0].elements['selectname'].options[sIndex].value;

To get the option's text
var optionsvalue = document.forms[0].elements['selectname'].options[sIndex].text;

It is easier to pass the selected index as a parameter

function changedata(sIndex){
...
var selectedoptionsvalue = document.forms[0].elements['days'].options[sIndex].value;
var selectedoptionstext = document.forms[0].elements['days'].options[sIndex].text;
...
<select id = "dayid" name="days" onchange="changedata(this.selectedIndex);">

Beware when using name or id. The classical reference is by name (it has the advantege to be full crosbrowser)

document.forms[formname_or_index].elements[elementname_or_index]...

glenngv

01-28-2005, 11:38 AM

<html>
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
var data = {
"Sun":["UserA","£15"],
"Mon":["UserB","£5"],
"Tue":["UserC","£50"],
"Wed":["UserD","£10"],
"Thu":["UserE","£1"],
"Fri":["UserF","£2"],
"Sat":["UserG","£20"]
};

function changedata(oDays)
{
var d = data[oDays.options[oDays.selectedIndex].value];
if (d){
document.getElementById('User').innerHTML = d[0];
document.getElementById('Price').innerHTML = d[1];

}
else {
document.getElementById('User').innerHTML = "Select an option from the combo box above";
document.getElementById('Price').innerHTML = "Price";
}
}
</script>
</head>
<body bgcolor="#FFFFFF" text="#000000">
<form name="form1" method="post" action="">
<select id="dayid" name="days" onchange="changedata(this);">
<option value="">Select one</option>
<option value="Sun">Sun</option>
<option value="Mon">Mon</option>
<option value="Tue">Tue</option>
<option value="Wed">Wed</option>
<option value="Thu">Thu</option>
<option value="Fri">Fri</option>
<option value="Sat">Sat</option>
</select>
<p id="User">Select an option from the combo box above</p>
<p id="Price">Price</p>
</form>
</body>
</html>