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.

Code:

<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

PHP Code:


			
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

Code:

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