Hi Neil
I am using the code from the webtricks.com site, just to try an get
thisworking before trying this with my table. What I need to figure out is
this and would be very grateful if you could help please..
If you look at the start of the javascript you can see that they are
outputting the results from the queries to create the arrays for the
javascript, what would I need to add to this part of the javascript is to
have more arrays I think generated so when the user selects a value from the
second select the third option is displayed based on the option they
selected.
<!--- 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>
<p>A very popular question is how to have the selection of an item in one
drop-down
box automatically populate another drop-down box without refreshing the
page. The answer
is JavaScript! Using arrays, you can have your second select box be
dependent on the
first one. Keep in mind, though, that all the data loads when the page
loads
and lengthy recordsets could mean a longer download time.</p>
<p>The following example will show each area code for a state. When you
select a different
state, the contents of the Area Code box will automatically change as
well.</p>
<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>
----- Original Message -----
From: "Robertson-Ravo, Neil (RX)" <[EMAIL PROTECTED]>
To: "CF-Talk" <[EMAIL PROTECTED]>
Sent: Thursday, December 05, 2002 2:08 PM
Subject: RE: Please help me achieve this with CF and Javascrip please
> It really shouldn't be difficult at all... what problems are you running
> into? have you got some semi-working code at all?
>
> -----Original Message-----
> From: Ian Vaughan [mailto:[EMAIL PROTECTED]]
> Sent: 05 December 2002 14:08
> To: CF-Talk
> Subject: Re: Please help me achieve this with CF and Javascrip please
>
>
> Just wondering if anybody else could shed some light on if this can
actually
> be accomplished??
>
> There must be a way of adding a third select dynamically to this code? I
> have been looking into it all morning with no success as of yet, but would
> be interesting to hear views from the experienced professional coldfusion
> and javascript developers on the list
>
>
> ----- Original Message -----
> From: "Bob Haroche" <[EMAIL PROTECTED]>
> To: "CF-Talk" <[EMAIL PROTECTED]>
> Sent: Wednesday, December 04, 2002 4:23 PM
> Subject: Re: Please help me achieve this with CF and Coldfusion please
>
>
> > > I am using a piece of code for 2 related selects shown below. I would
> like
> > > to add a third select field and have this generated dynamically from a
> > > database using Coldfusion like the other two selects shown below.
> >
> > Nate Weiss has a custom tag called Three Related Selects or something
> > similar on the MM Exchange.
> >
> > Re the script you posted, I've used that one to create a modified
version
> of
> > three related selects. In my case, I needed both selects 2 and 3
> (populated
> > with the same values) to change when select 1 was chosen. In my case
> select
> > 3 wasn't controlled by select 2 but was also controlled by select 1. The
> > situation was that user chooses "Animal Type" (select 1) and then
selects
> > "Primary Breed" (select 2) and "Secondary Breed" (select 3). Let me know
> if
> > you're interested in that type of code.
> >
> > ---------------
> > Regards,
> > Bob Haroche
> > O n P o i n t S o l u t i o n s
> > www.OnPointSolutions.com
> >
> >
> >
> >
>
>
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
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
Get the mailserver that powers this list at http://www.coolfusion.com
