In a nutshell, I'm using JavaScript to populate and control select boxes in a form. What I'm doing is passing arrays from PHP to JavaScript so they can be accessible after the page loads into the browser.

This is how I do it...

PHP parses the array data into my JavaScript output
PHP Code:
// $js_content is passed to html within script tags
$js_content "var dataArray = new Array();";

foreach (
$dataArray as $key => $val)
{
    
$js_content.= "
dataArray['"
.$key."'] = \"".$val."\";";
}

$js_content.= "
            
function setVariable(selection)
{
    alert('dataArray[' + selection + '] = ' + dataArray[selection]);
}"

Then the form uses an onchange handler to activate the function
HTML Code:
<select name="select_field" onchange="setVariable(this.options[this.selectedIndex].value);">
	<!-- options... -->
</select>
Finally, when the two are put together, the user should choose an option in the select box and the JavaScript should execute; and it works... mostly.

See, this section of the script works perfectly:
HTML Code:
var purchasetypeArray = new Array();
purchasetypeArray['0'] = "Sale";
purchasetypeArray['1'] = "Lease";
purchasetypeArray['2'] = "Participation";
purchasetypeArray['3'] = "Maintenance";
purchasetypeArray['4'] = "Warranty";

function selectType(selection)
{
	alert('purchasetypeArray[' + selection + '] = ' + purchasetypeArray[selection]);
	
	switchMenu('typedetails_Sale',			'none');
	switchMenu('typedetails_Lease',			'none');
	switchMenu('typedetails_Participation',	'none');
	switchMenu('typedetails_Maintenance',	'none');
	switchMenu('typedetails_Warranty',		'none');
	
	switchMenu('typedetails_' + purchasetypeArray[selection], 'block');
}
But these, however, does not:
HTML Code:
var categoryArray = new Array();
categoryArray['0'] = "Software Upgrade";
categoryArray['1'] = "Hardware Upgrade";
categoryArray['3'] = "Spare Parts";
categoryArray['4'] = "Warranty Parts";
categoryArray['5'] = "New Table";
categoryArray['6'] = "Refurbished Table";
categoryArray['7'] = "Maintenance";
categoryArray['8'] = "Return";
categoryArray['9'] = "Service Parts";

function setCategory(selection)
{
	var myCategory = categoryArray[selection];
	alert('categoryArray[' + selection + '] = ' + categoryArray[selection]);
	
	switchMenu('Software Upgrade',	'none');
	switchMenu('Hardware Upgrade',	'none');
	switchMenu('Return',		'none');
	
	if (currentTable == 'defaultValue')
	{
		alert('Table must be selected.');
		document.new_request.categoryid[0].selected = '1';
	}
	else
	{
		switchMenu(myCategory, 'block');
	}
}

var currentPartNo = '';

var partArray = new Array();
partArray['119'] = "Key for Bill Validator";
partArray['121'] = "Key for Power Door";
partArray['120'] = "Key For Shoe";
<!-- ect, ect... -->

function setPartNo(selection)
{
	alert('partArray[' + selection + '] = ' + partArray[selection]);
	document.new_request.partname.value = partArray[selection];
	
	currentPartNo = selection;
	
	setUnitPrice();
}
What I don't understand, though, is that the point at which it breaks down is only when I try to access the categoryArray. I've switched up the code to have it access other arrays and it works. Additionally, though, I've set other functions to reference the category array and they also malfunction. The only problem is that I can't find any errors.