zama
07-28-2003, 04:17 PM
I have a select box that is dependent on the selection of radio buttons.
What I want to be able to do:
When page is loaded - value in select box should be #EditAnimalTreat.Species_name# (first query in code)
At the moment this happens when user clicks correct radio button. ie: <input type="radio" name="group" id="group1" value="user" onclick="populateListBox(this.value);" > <label for="group1">Species for this site</label>
Here is my current code:
<CFQUERY Name="Plant2" DATASOURCE="Invasive">
Select * From lu_species
WHERE code = #EditAnimalTreat.Species_ID#
</CFQUERY>
<cfquery name="Bird" datasource="Invasive">
select Name, code, Type
from lu_Species
where Type='Bird'
order by name
</CFQUERY>
<cfquery name="Herptile" datasource="Invasive">
select Name, code, Type
from lu_Species
where Type='Herptile'
order by name
</cfquery>
<cfquery name="Mammal" datasource="Invasive">
select Name, code, Type
from lu_Species
where Type='Mammal'
order by name
</cfquery>
<script>
var myArray = new Array();
myArray['herptile'] = new Array <CFOUTPUT>(#quotedValueList(Herptile.Name)#);
myArray['bird'] = new Array(#quotedValueList(Bird.Name)#);
myArray['mammal'] = new Array (#quotedValueList(Mammal.Name)#);
myArray['user'] = new Array (#quotedValueList(Plant2.Name)#);
</CFOUTPUT>
function populateListBox(grp) {
document.Animal.theListBox.options.length = 0;
for (var i=0; i<myArray[grp].length; i++) {
document.Animal.theListBox.options[i] = new Option(myArray[grp][i], myArray[grp][i]);
}
}
</script>
<form name="Animal" Action="UpdateAnimalTreat3.cfm" Method="post">
<BODY>
<tr>
<td class="top2"><b><font color="red"><select name="theListBox" id="theListBox" style="width:150px"><option>Select Animal Type</select>
<input type="radio" name="group" id="group1" value="user" onclick="populateListBox(this.value);" > <label for="group1">Species for this site</label>
<input type="radio" name="group" id="group2" value="herptile" onclick="populateListBox(this.value);"> <label for="group2">Herptile</label><br>
<input type="radio" name="group" id="group3" value="bird" onclick="populateListBox(this.value);"> <label for="group3">Bird</label><br>
<input type="radio" name="group" id="group4" value="mammal" onclick="populateListBox(this.value);"> <label for="group4">Mammal</label>
</tr>
How do I do this?
Thanks for your help
What I want to be able to do:
When page is loaded - value in select box should be #EditAnimalTreat.Species_name# (first query in code)
At the moment this happens when user clicks correct radio button. ie: <input type="radio" name="group" id="group1" value="user" onclick="populateListBox(this.value);" > <label for="group1">Species for this site</label>
Here is my current code:
<CFQUERY Name="Plant2" DATASOURCE="Invasive">
Select * From lu_species
WHERE code = #EditAnimalTreat.Species_ID#
</CFQUERY>
<cfquery name="Bird" datasource="Invasive">
select Name, code, Type
from lu_Species
where Type='Bird'
order by name
</CFQUERY>
<cfquery name="Herptile" datasource="Invasive">
select Name, code, Type
from lu_Species
where Type='Herptile'
order by name
</cfquery>
<cfquery name="Mammal" datasource="Invasive">
select Name, code, Type
from lu_Species
where Type='Mammal'
order by name
</cfquery>
<script>
var myArray = new Array();
myArray['herptile'] = new Array <CFOUTPUT>(#quotedValueList(Herptile.Name)#);
myArray['bird'] = new Array(#quotedValueList(Bird.Name)#);
myArray['mammal'] = new Array (#quotedValueList(Mammal.Name)#);
myArray['user'] = new Array (#quotedValueList(Plant2.Name)#);
</CFOUTPUT>
function populateListBox(grp) {
document.Animal.theListBox.options.length = 0;
for (var i=0; i<myArray[grp].length; i++) {
document.Animal.theListBox.options[i] = new Option(myArray[grp][i], myArray[grp][i]);
}
}
</script>
<form name="Animal" Action="UpdateAnimalTreat3.cfm" Method="post">
<BODY>
<tr>
<td class="top2"><b><font color="red"><select name="theListBox" id="theListBox" style="width:150px"><option>Select Animal Type</select>
<input type="radio" name="group" id="group1" value="user" onclick="populateListBox(this.value);" > <label for="group1">Species for this site</label>
<input type="radio" name="group" id="group2" value="herptile" onclick="populateListBox(this.value);"> <label for="group2">Herptile</label><br>
<input type="radio" name="group" id="group3" value="bird" onclick="populateListBox(this.value);"> <label for="group3">Bird</label><br>
<input type="radio" name="group" id="group4" value="mammal" onclick="populateListBox(this.value);"> <label for="group4">Mammal</label>
</tr>
How do I do this?
Thanks for your help