[RESOLVED] Adding Options to a Select Box

[Errant_Shadow]

I've searched the web and every tutorial I can find says the same thing, and I am doing what they say, but it's inexplicably not working.

Basically, I'm using a nested object to populate a select box using the new Option() method. Unfortunately, when I include the new Option line, it breaks the loop and does not add anything...

// note: mySelectBox = document.new_issue.upgradeid;

// clear select box
mySelectBox.length = 0;

// and re-populate...
for (var key in upgradeprogArray[myGame])
{
	var currentIndex = mySelectBox.length;
	var currentValue = upgradeprogArray[myGame][key];
	
	if (currentValue != '')
	{
		alert('mySelectBox.option['+ currentIndex +'] = new Option('+ currentValue +', '+ key +')');
	//	mySelectBox.option[currentIndex] = new Option(currentValue, key);
	}
}

When this is run, it traces each item that it would have added and all the data passed to the alert box is accurate.

Unfortunately, when that last line is NOT commented out, it only executes the loop once and then breaks without adding any options to my select box.

Any ideas?

[Errant_Shadow]

I even tried defining mySelectBox with getElementById, but to the same malfunctioning ends.

[Fang]

option is plural

mySelectBox.options[currentIndex]

[Kor]

for (var key in upgradeprogArray[myGame])

If upgradeprogArray[myGame] is not an object (an unordered array), but an array, you should use the ordered for() loop (specific to the arrays), not an unordered loop (which in JavaScript is used for objects).

for(var i=0;i<upgradeprogArray[myGame].length;i++)

The reason is simple. In JavaScript all the elements, variables, etc are objects. Native objects have a lot of native properties. An Array is also an object, and, besides his elements (which are custom properties), it has some other "technical", native properties, such as length. An unordered loop will include those native properties along the elements, which is not what you need.

[Errant_Shadow]

omg the solution was actually something simple ><;;

Moral: check syntax carefully -_-

Thank you, Fang, I really appreciate it.

If you've got a moment, I'm completely stumped with another problem over in another thread: Very simple method doesn't work reliably. I hope more eyes may see something I missed.

[Errant_Shadow]

If upgradeprogArray[myGame] is not an object (an unordered array), but an array, you should use the ordered for() loop (specific to the arrays), not an unordered loop (which in JavaScript is used for objects).

With the addition of the missing s on options, the scrips works perfectly.

I tried defining upgradeArray as an object using both these methods:

Method 1:

var object = 
{
	'category1' : {'index1' = 'value', 'index2' = 'value', etc...},
	'categroy2' : {etc...}
};

Method 2:

var object = {};
object['category1'] = {};
object['category1']['index1'] = 'value';
object['category1']['index2'] = 'value';
etc...

But the script refused to recognize it and it was behaving like my other script, where it just doesn't do anything if I try to reference the object.

The only way I could get it to work is with this:

var array = new Array();
array['categroy1'] = new Array();
array['categroy1']['index1'] = 'value';
array['categroy1']['index2'] = 'value';
etc...

[Kor]

You still confound arrays with objects

Method 1

var object = 
{
	'category1' : {'index1' = 'value', 'index2' = 'value', etc...},
	'categroy2' : {etc...}
};

Should be:

var object = 
{
	'category1' : {'index1': 'value', 'index2': 'value', etc...},
	'categroy2' : {etc...}
};

Method 2 should work, I don't see why not.

Method 3 is not quite good, as you set a variable (array['categroy1']) as an Array, but you try to construct it as an Object.

[Kor]

Arrays:

//Method 1
var array=['value1','value2','value2'];
//Method 2
var array=[];
array[0]='value1';
array[1]='value1';
array[2]='value1';

Objects:

//Method 1
var object={'key1':'value1','key2':'value2','key3':'value3'};
//Method 2
var object={};
object['key1']='value1';
object['key2']='value2';
object['key3']='value3';

[Errant_Shadow]

that was my typo as I re-wrote what I tried before.

that third method I posted is working.

On the other hand, I gave the method 1 object another try and it seems to work as well. it just requires a lot more lines than what I'm using.

this:

$js_content.= "
            var upgradeprogArray = 
            {";
end($upgradeprogArray);
$lastGame = current($upgradeprogArray);
foreach ($upgradeprogArray as $game => $subArray)
{
    $js_content.= "
                \"".$game."\" : 
                {";
    
    end($subArray);
    $lastVal = current($subArray);
    foreach ($subArray as $key => $val)
    {
        $js_content.= "
                    \"".$key."\" : '".mysql_real_escape_string($val)."'";
        $js_content.= ($val != $lastVal)? "," : "";
    }
    $js_content.= "
                }";
    $js_content.= ($game != $lastGame)? "," : "";
}

$content.= "
            }; 

			var upgradeprogArray = 
			{
				'game1' :
				{
					'key' : 'val',
					'key' : 'val',
					etc...
				},
				'game2' :
				{
					'key' : 'val',
					etc...
				}
			};

as opposed to this (which works):

$js_content.= "
            var upgradeprogArray = new Array();";
foreach ($upgradeprogArray as $game => $subArray)
{
    $js_content.= "
            upgradeprogArray[\"".$game."\"] = new Array();";
    
    foreach ($subArray as $key => $val)
    {
        $js_content.= "
            upgradeprogArray[\"".$game."\"][\"".$key."\"] = '".mysql_real_escape_string($val)."';";
    }
} 

			var upgradeprogArray = new Array();
			var upgradeprogArray['game1'] = new Array();
			var upgradeprogArray['game1']['key'] = 'val';
			var upgradeprogArray['game1']['key'] = 'val';
			etc...
			var upgradeprogArray['game2'] = new Array();
			var upgradeprogArray['game2']['key'] = 'val';
			etc...

[Kor]

Which is more important: To write a few extra code lines? Or to use the correct syntax?

Now: does, or does not your code work?

[Errant_Shadow]

Which is more important: To write a few extra code lines? Or to use the correct syntax?

Now: does, or does not your code work?

It's most important that my code work reliably.

Being that these are 2 threads, I should point out that these problems are coming from 2 completely different files. Yes, they belong to the same project, but the errors are completely different.

This problem was fixed when I added that missing s to "options"

The other problem will be fixed as soon as I track down the source.