Hi,
Classic case of wanting to populate Select Box #2 with Select Box #1 - of course can't do it easily......
Here's my code that I modified from a tutorial out on:
Here, he's trying to populate a second City box based on a Select of a state. I want to populate a Vendors box based on a select of a Service.
I've been trying to figure this out for a couple of weeks and more than a little frustrated.
I'm able to load my services in the first box, but the second select box doesn't even try to load up. Followed the tutorial to the T, but I think I'm having trouble with the placement of my code.
Thanks in advance for any help.
soho34
Classic case of wanting to populate Select Box #2 with Select Box #1 - of course can't do it easily......
Here's my code that I modified from a tutorial out on:
Here, he's trying to populate a second City box based on a Select of a state. I want to populate a Vendors box based on a select of a Service.
Code:
<!--- get vendor/service query --->
<cfquery name="vendor_services" datasource="#request.dsn#">
select distinct
st.description,
v.name as vendor
from servicetypes st left join
vendortypes vt on st.servicetypesid = vt.servicetypeid left join
vendors v on vt.vendorid = v.vendorid
order by description asc
</cfquery>
<cfdump var="#vendor_services#">
<!--- all services --->
<cfquery dbtype="query" name="allServices">
select distinct
description
from vendor_services
order by description asc
</cfquery>
<cfdump var="#allServices#">
<body>
<script type="text/javascript">
<!--
var NumberOfServices=document.vendor_service.service_id.options.length;
var VendorServiceArray=new Array(NumberOfServices);
VendorServiceArray[0]=new Array();
VendorServiceArray[0][0]=new Option("select a vendor...","");
<cfloop index="i" from="1" to="#allServices.recordcount#">
VendorServiceArray[<cfoutput>#i#</cfoutput>]=new Array();
<cfquery name="selectedVendor_Services" dbtype="query">
select vendor from vendor_services where description = '#allServices.description[i]#' order by vendor asc
</cfquery>
<cfoutput query="selectedVendor_Services">
VendorServiceArray[#i#][#selectedVendor_Services.CurrentRow#]=new Option('#JSStringFormat(selectedVendor_Services.vendor)#','#JSStringFormat(selectedVendor_Services.vendor)#');
</cfoutput>
</cfloop>
function redirect(x){
for (m=document.vendor_service.vendor.options.length-1;m>0;m--)
document.vendor_service.vendor.options[m]=null
for (i=1;i<VendorServicearray[x].length;i++){
document.vendor_service.vendor.options[i]=new Option(VendorServiceArray[x][i].text,VendorServiceArray[x][i].value)
}
document.vendor_service.vendor.options[0].selected=true
}
//var temp=document.vendor_service.vendor;
function FindVendors(PickedService){
alert('made it to the mf');
alert(PickedService);
for (m=document.vendor_service.vendor.options.length-1;m>0;m--)
document.vendor_service.vendor.options[m]=null
for (i=1;i<VendorServiceArray[PickedService].length;i++){
document.vendor_service.vendor.options[i]=new Option(VendorServiceArray[PickedService][i].text,VendorServiceArray[PickedService][i].value)
} //inner for
document.vendor_service.vendor.options[0].selected=true
} //function
//-->
</script>
<form name="vendor_service" action="test.cfm" method="post">
Service:
<SELECT NAME="service_id" SIZE="1" onChange="FindVendors(this.options.selectedIndex);">
<OPTION VALUE="">Select a service...</OPTION>
<CFOUTPUT QUERY="allServices">
<OPTION VALUE="#description#">#description#</OPTION>
</CFOUTPUT>
</SELECT>
Vendor:
<SELECT NAME="vendor" SIZE="1">
<OPTION VALUE="">Select a vendor...</OPTION>
</SELECT>
</form>
</body>
I've been trying to figure this out for a couple of weeks and more than a little frustrated.
I'm able to load my services in the first box, but the second select box doesn't even try to load up. Followed the tutorial to the T, but I think I'm having trouble with the placement of my code.
Thanks in advance for any help.
soho34