I am trying to do 2 or more ajax queries after each other. I
can get the first query to work with CF but none after that.
Basically I have a drop down list of buildings when you select the
buildings it calls a coldfusion page with a query on that returns
all of the controllers under that building to a target div on the
first page. That all works fine. Another drop down menu is returned
with the query results in it. I want to then select a controller in
that drop down box and have it go out and query a model and return
that. I just don't know how to do query after query with ajax. Here
is my code:
First Page:
<script language = "javascript">
var XMLHttpRequestObject = false;
if (window.XMLHttpRequest) {
XMLHttpRequestObject = new XMLHttpRequest();
} else if (window.ActiveXObject) {
XMLHttpRequestObject = new
ActiveXObject("Microsoft.XMLHTTP");
}
function getData(dataSource, divID, inputID)
{
if(XMLHttpRequestObject) {
var obj = document.getElementById(divID);
var data = inputID + '=' +
document.getElementById(inputID).value;
XMLHttpRequestObject.open("POST", dataSource,2);
XMLHttpRequestObject.setRequestHeader('Content-Type',
'application/x-www-form-urlencoded');
XMLHttpRequestObject.onreadystatechange = function()
{
if (XMLHttpRequestObject.readyState == 4 &&
XMLHttpRequestObject.status == 200) {
obj.innerHTML = XMLHttpRequestObject.responseText;
}
}
</script>
<tr valign="top"><td class="wobar"
valign="top"><select name="location" id="location" onchange =
"getData('controllerquery.cfm', 'targetDiv',
'location')"><option></option>
<cfoutput query="locations"><option
value="#Location#">#Location#
#LocName#</option></cfoutput></select></td>
</form>
<td class="wobar" valign="top">
<div id="targetDiv">
<form>
<select name="controller" id="controller">
<option></option>
</select>
</form>
</div>
</td>
<form>
<td class="wobar" valign="top"><div
id="targetDiv2"><input type="text"
size="10"></div></td>
<td valign="top" class="wobar"><input name=""
type="text" size="10"></td>
<td valign="top" class="wobar"><input name=""
type="text" size="10"></td>
</tr>
It then queries this page:
<cfquery name="controllers" datasource="ds">
select Controller from inventory
where Location = '#left(form.location, 4)#'
</cfquery>
<form name="form" id="form">
<select name="controller" id="controller" onchange =
"getData2('modelquery.cfm', 'targetDiv2', 'controller')">
<cfoutput
query="controllers"><option>#controller#</option></cfoutput>
</select>
</form>
Does anyone know how I would query another page based on what
was returned in the #controller# variable?
Any ideas are appreciated!
1
Reply
AdChoices