Static Array and multiple combo boxes [Archive]

scottyman

01-15-2003, 04:26 AM

Hey all -
I'm trying to port my latest project to an offline website running off cdrom -
to do this, I'm trying to create a static array with multiple combo boxes to filter the data...

i.e.
combo box 1 contains countries
combo box 2 contains resorts
combo box 3 contains hotels

hotels is a subset to both resorts and countries, resorts is a subset of countries...

I can build three different arrays - but without making a seperate array for each resort and each country - I can't find any way to link all these together! *sob*

Any ideas on how I can get each relating to each other?

scottyman

01-16-2003, 05:39 AM

This is as far as I've got....

<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT langauge=javascript>
var aHTValues = new Array() ;
aHTValues[0] = new Array();
aHTValues[1] = new Array("Florida","LA","New York");
aHTValues[2] = new Array("Denmark", "Ireland", "Paris");
aHTValues[3] = new Array("Antigua", "Cuba", "Dom. Rep");

var aREValues = new Array() ;
aREValues[0] = new Array("Disney", "Cocoa Beach", "Wet 'n' Wild");
aREValues[1] = new Array("Universal","Westwood","San Fran");
aREValues[2] = new Array("Times Sq.", "Central Park", "Bronx");
aREValues[3] = new Array("No Idea", "Somewhere Cold", "The Bar");
aREValues[4] = new Array("St. James Gate","Pub","Another Pub");
aREValues[5] = new Array("Some Cathedral", "Airport", "Bar");
aREValues[6] = new Array("Somewhere Expensive", "Somewhere Cheap", "A Bar?");
aREValues[7] = new Array("Lunch with Castro", "Cuban Bar", "Lunch somewhere Cheap");
aREValues[8] = new Array("Running out of Ideas", "Bored with this Now", "Reslly need a drink!");

function addHTElement(oHT, value, text)
{
var oNewRE = new Option(text) ;
oNewRE.value = value;

oHT.options[oHT.options.length] = oNewRE ;
}

function addREElement(oRE, value, text)
{
var oNewHT = new Option(text) ;
oNewHT.value = value;

oRE.options[oRE.options.length] = oNewHT ;
}

function updateHT()
{
var oHTDestination = document.the_form.destination ;
var oHTResort = document.the_form.resort ;
var oHTHotel = document.the_form.hotel ;
var nSelId = oHTDestination[oHTDestination.selectedIndex].value ;
// var nSelHt = oHTResort[oHTResort.selectedIndex].value ;

oHTResort.length = 0 ; // Clear the HT
// oHTHotel.length = 0 ;

for(nLoop = 0; nLoop < aHTValues[nSelId].length; nLoop++)
{
addHTElement(oHTResort, nLoop, aHTValues[nSelId][nLoop]) ;
}
// for(nLoop = 0; nLoop < aREValues[nSelHt].length; nLoop++)
// {
// addREElement(oHTHotel, nLoop, aREValues[nSelHt][nLoop]) ;
// }
}

function updateRE()
{
var oHTDestination = document.the_form.destination ;
var oHTResort = document.the_form.resort ;
var oHTHotel = document.the_form.hotel ;
// var nSelId = oHTDestination[oHTDestination.selectedIndex].value ;
var nSelHt = oHTResort[oHTResort.selectedIndex].value ;

// oHTResort.length = 0 ; // Clear the LB
oHTHotel.length = 0 ;

// for(nLoop = 0; nLoop < aHTValues[nSelId].length; nLoop++)
// {
// addHTElement(oHTResort, nLoop, aHTValues[nSelId][nLoop]) ;
// }
for(nLoop = 0; nLoop < aREValues[nSelHt].length; nLoop++)
{
addREElement(oHTHotel, nLoop, aREValues[nSelHt][nLoop]) ;
}
}
function onLoad()
{
updateHT() ;
updateRE() ;
}
</SCRIPT>

</HEAD>
<BODY onLoad="onLoad()">

<form name="the_form">

<select name="destination" onChange="updateHT()">
<option value=0 selected>Select...
<option value=1>America
<option value=2>Europe
<option value=3>Carribean
</select>

<select name="resort" onChange="updateRE()">
<option>FALSE
</select>

<select name="hotel">
<option>FALSE
</select>
</form>

</BODY>
</HTML>

As you can see - I've stuffed up somewhere - and it's not incrementing the array as I expected... any ideas?