Hi
Does anybody have any ideas on how to add a third select box to the current
code below which only deals with two select boxes at the moment. The code
below is taken from
http://www.webtricks.com/sourcecode/source_code.cfm?CodeID=18
It is using Javascript and Coldfusion to build the arrays and would be
interested to know if a third select can be added with the necessary
Coldfusion to add the dynamic capabilities the code below has
<!--- Select the states and area codes. --->
<cfquery datasource="#Request.App.ds#" name="GetStates">
SELECT S.State, S.StateCode, AC.AreaCode
FROM States S, AreaCodes AC
WHERE S.StateCode=AC.StateCode
ORDER BY S.State, AC.AreaCode
</cfquery>
<!--- Select all the area codes. --->
<cfquery datasource="#Request.App.ds#" name="GetCodes">
SELECT AreaCode
FROM AreaCodes
ORDER BY AreaCode
</cfquery>
<script language = "JavaScript">
<!--
// For each state, create an array to hold the area codes.
// Each state array will be identified by the two-character state
abbreviation
<cfoutput query="GetStates" group="State">
// Create the array
StateArray#StateCode# = new Array();
<cfset i = 0>
// Populate the array
<cfoutput>
<cfset i = i + 1>
StateArray#StateCode#[#i#] = #AreaCode#;
</cfoutput>
</cfoutput>
// Function to populate the area codes for the state selected
function PopulateAreaCode() {
// Only process the function if the first item is not selected.
if (document.StateForm.StateCode.selectedIndex != 0) {
// Find the state abbreviation
var ThisState =
document.StateForm.StateCode[document.StateForm.StateCode.selectedIndex].val
ue;
// Set the length of the arecode drop down equal to the length of the
state's array
document.StateForm.AreaCode.length = eval("StateArray" + ThisState +
".length");
// Put 'Select' as the first option in the area code drop-down
document.StateForm.AreaCode[0].value = "";
document.StateForm.AreaCode[0].text = "Select";
document.StateForm.AreaCode[0].selected = true;
// Loop through the state's array and populate the area code drop
down.
for (i=1; i<eval("StateArray" + ThisState + ".length"); i++) {
document.StateForm.AreaCode[i].value = eval("StateArray" +
ThisState + "[i]");
document.StateForm.AreaCode[i].text = eval("StateArray" + ThisState
+ "[i]");
}
}
}
//-->
</script>
<form name="StateForm">
<p>
<table border="0">
<tr>
<td><b>State</b></td>
<td><b>Area Code</b></td>
</tr>
<tr>
<td>
<select name="StateCode" onChange="PopulateAreaCode()">
<option value="0">Select State
<cfoutput query="GetStates" group="State">
<option value="#StateCode#">#State#
</cfoutput>
</select>
</td>
<td>
<select name="AreaCode" width="70" style="width:150" size="1">
<option value="0">Select Area Code
<cfoutput query="GetCodes">
<option value="#AreaCode#">#AreaCode#
</cfoutput>
</select>
</td>
</tr>
</table>
</p>
</form>
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Archives: http://www.houseoffusion.com/cf_lists/index.cfm?forumid=4
Subscription:
http://www.houseoffusion.com/cf_lists/index.cfm?method=subscribe&forumid=4
FAQ: http://www.thenetprofits.co.uk/coldfusion/faq
This list and all House of Fusion resources hosted by CFHosting.com. The place for
dependable ColdFusion Hosting.
