I've got the below code which i use to read my DB and populate my dropdowns. I need for them to be realated, but i just realise i need a third related dropdown to list the products that fall inside those related categories but i'm not sure how to edit the javascript to include the info from the 3rd combo ?

PHP Code:
<script language="JavaScript">
<!--
//
//create  an array of Categories
var CategoryArray = new Array("VEHICLES""WEAPONS");            

//create an arry of the selected SubCategories 
            
var selectedCategoryArray = new Array();
CategoryArray.VEHICLES=new Array("AIRCRAFT""ARMOURED""ARTILLERY""COMBAT SUPPORT""COMMUNICATIONS""ENGINEER""INFANTRY""LOGISTICS");
CategoryArray.WEAPONS=new Array("AIR DEFENSE""ANTI-TANK""ARTILLERY""MACHINE GUNS""MORTARS");
                                

            
            function 
setCategories(myCategory)
            {
                
/* this function checks the selected Category and populates 
                the SubCategories based on that Category.
                */
                
                
var CategoryField document.form.SubCategory;
                
CategoryField.length 0;
                
                if (
myCategory.selectedIndex == -1
                {
//no Category chosen
                    
CategoryField.length 1;
                    
CategoryField.options[0].value="";
                    
CategoryField.options[0].text="Chose an item...";
                }
                else
                {
                    
//get the associated Category array
                    
var myCategoryArray = eval("CategoryArray." myCategory.options[myCategory.selectedIndex].value);
                    
//make the selectedCategory array a string for easier searching
                    
var selectedSubCategory selectedCategoryArray.toString();
                    
                    var 
count 0;
                    for (var 
i=0i<myCategoryArray.lengthi++)
                    {
                        if (
selectedSubCategory.indexOf(myCategory.options[myCategory.selectedIndex].value "->" myCategoryArray[i]) == -1)
                        {
//not selected, so display it
                            
CategoryField.length++;
                            
CategoryField[count].value myCategoryArray[i];
                            
CategoryField[count].text myCategoryArray[i];
                            
count++;
                        }
                    }
                }
            }
//end function
            
            
function buildSelect(mySelectmyArray)
            {
                
//clear the select
                
mySelect.length=0;
                
mySelect.length=myArray.length;
                
                
//populate the select
                
var 0;
                for(var 
i=0i<myArray.lengthi++)
                {
                    if (
myArray[i] != "")
                    {
                        
mySelect.options[j].value=myArray[i];
                        
mySelect.options[j].text=myArray[i];
                        
j++;
                    }
                }
            }
            
            function 
addSelection()
            {
                
/*
                    this function adds a selection to selectedSubCategory and 
                    and then rebuilds both selects
                */
                
                
var myForm document.form;
                if (! (
myForm.Categorys.selectedIndex >= 0)) return(false);
                var 
myCategory myForm.Categorys.options[myForm.Categorys.selectedIndex].value;
                var 
srcSelect myForm.SubCategory;
                var 
dstSelect myForm.selectedSubCategory;
                var 
selectedCategoryArray.length;
                
                for(var 
i=(srcSelect.length-1); i>=0i--)
                {
                    if (
srcSelect.options[i].selected)
                    {
                        
//increament array length
                        
selectedCategoryArray.length++;
                        
                        
//get the selected Category
                        
selectedCategoryArray[j]=myCategory "->" srcSelect.options[i].value;
                        
                        
//increment the array counter
                        
j++;
                    }
                }
//end for loop
                
                //sort the selected array
                
selectedCategoryArray.sort();
                
                
//rebuild selectedSubCategory
                
buildSelect(dstSelectselectedCategoryArray);
                
                
//rebuild the Category select
                
setCategories(myForm.Categorys);
                
/*                if ((dstSelect.length == 0) || (dstSelect.options[0].text == ""))
                {
                    if (dstSelect.length == 0) dstSelect.length++;
                    if (dstSelect.options[0].text == "")
                    {
                        dstSelect.options[0].text = "None Selected";
                    }
                }*/
            
}//end function
            
            
function deleteSelection()
            {
                
/* this function removes the selected SubCategory from 
                the selected array and then rebuilds both selects 
                */
                
                
var myForm document.form;
                var 
srcSelect myForm.selectedSubCategory;
                var 
tmpCategoryArray = new Array();
                
                for (var 
i=0i<srcSelect.lengthi++)
                    if (! 
srcSelect.options[i].selected)
                    {
//not selected for removal so keep it
                        
tmpCategoryArray.length++;
                        
tmpCategoryArray[tmpCategoryArray.length-1]=srcSelect.options[i].value;
                    }
                
                
//sort the SubCategory 
                
tmpCategoryArray.sort();
                
                
//rebuild selected SubCategory
                
selectedCategoryArray tmpCategoryArray;
                
buildSelect(srcSelectselectedCategoryArray);
                
                
//rebuild the Category select
                
setCategories(myForm.Categorys);
                
                if ((
srcSelect.length == 0) || (srcSelect.options[0].text == ""))
                {
                    if (
srcSelect.length == 0srcSelect.length++;
                    if (
srcSelect.options[0].text == "")
                    {
                        
srcSelect.options[0].text "None Selected";
                    }
                }
            }
            
            function 
validateForm(myForm)
            {
                
/* this function makes sure at least one Category is 
                seleced before submiting the form 
                */
                
                
var mySelect myForm.selectedSubCategory;
                if (
mySelect.length == 0)
                {
                    
alert("Please select one or more Categorys and SubCategory.");
                    return(
false);
                }
                else
                {
//select all of them so they submit
                    
for (var i=0i<mySelect.lengthi++)
                        
mySelect[i].selected=true;
                    
                    return(
true);
                }
            }
            
//-->
        
</script>
            <form name="form" action="" method="post" onSubmit="return(validateForm(this));">
            <table cellpadding="2" cellspacing="2" border="0" align="center">
                <tr>
                    <td valign="top">
                        <select name="Categorys" id="Categorys" size="10" onChange="setCategories(this);">
                    <option value='VEHICLES'>VEHICLES</option>
<option value='WEAPONS'>WEAPONS</option>
</select>
<p></p>

    
                        </select>
                    </td>
                    <td valign="top">
                        <select name="SubCategory" id="SubCategory" size="10" multiple>
                            <option value="" selected>Chose an item...
                        </select>
                    </td>
                    <td valign="top">
                        <br>
                        <br>
                        <input type="button" name="add" value="Add --&gt;" onClick="addSelection();">
                        <br>
                        <br>
                        <input type="button" name="remove" value="&lt;-- Remove" onClick="deleteSelection();">
                    </td>
                    <td valign="top">
                        <select name="selectedSubCategory" id="selectedSubCategory" size="10" multiple>
                            <option value="">None Selected
                        </select>

                    </td>
                    <td valign="top">
                        <br>
                        <input type="submit" name="save" value="Save">
                    </td>
                </tr>
            </table>
        </form>