We help IT Professionals succeed at work.

Ajax, ASP Drop Down Issue - Loads Duplicate Of Current Page In Div

DanielR6
DanielR6 asked
on
289 Views
Last Modified: 2012-05-06
Hi E.E

I have two dropdowns using ajax and asp, like most the second select filters depending on the first. Issue im getting is that when I make a selection on the first the div where second list gets populated gets filled by what looks like is a duplicate of the current page.

I have included all the necessary code so hopefully the glitch will be in there somewhere. I am including all the files on the same page, there's not a seperate asp file being called by the ajax script. Im thinking that may have something to do with it, and it's possibly trying to load the current page into it's self.

Thanks in advance for any help received
Dan
<------------------------------- SUB ROUNTINE CALLED ---------------------->
<% Sub getModels
dim conn
dim sql
dim manuvalue
manuvalue = request.querystring("man-select")
response.expires=-1
sql= "SELECT DISTINCT ModelID FROM troika_stock WHERE ManufacturerID= "
sql=sql & "'" & manuvalue & "'"
set conn=Server.CreateObject("ADODB.Connection")
conn.Provider="Microsoft.Jet.OLEDB.4.0"
conn.Open(Server.Mappath("sum.mdb"))
set RS=Server.CreateObject("ADODB.recordset")
RS.Open sql,conn
if manuvalue <> "" then 
response.write "<div class=""clearlist""" & ">" & "<a href="""""  & ">" & "clear results" & "</a>" & "</div>"
end if
response.write "<select id=""mod-select""" & "class=""searchbox-dd""" & "onchange=""this.form.submit()""" & vbCRLF
if manuvalue = "" then 
response.write "disabled"
end if	
response.write ">"
response.write("<option selected=""selected""" & "class=""searchbox-dd-item""" & "value=""""" & ">" & "[ All Models]" & "</option>")	
response.write("<optgroup label='Models'"">")
if not RS.eof then
do while not RS.eof					
response.write ("<option value=""" & RS("ModelID") & """" & "class=""searchbox-dd-item""" & ">" & RS("ModelID") & "&nbsp;&nbsp;"  & "</option>")
RS.movenext
loop
end if             
response.write("</optgroup>")      
response.write ("</select>")
RS.close
set RS = nothing
conn.close
set conn =nothing
End Sub
%>
 
<------------------------------- SUB ROUNTINE CALLED (END) ---------------------->
 
<------------------------------- AJAX CALLED ---------------------->
 
<script type="text/javascript">
 
/***********************************************
* Dynamic Ajax Content- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
 
var loadedobjects = "";
var rootdomain = "http://" + window.location.hostname;
 
function ajaxpage(url, containerid){
var page_request = false;
	if (window.XMLHttpRequest) // if Mozilla, Safari etc
		page_request = new XMLHttpRequest()
	else if (window.ActiveXObject){ // if IE
		try {
	page_request = new ActiveXObject("Msxml2.XMLHTTP")
		} 
		catch (e){
	try{
	page_request = new ActiveXObject("Microsoft.XMLHTTP")
			}
		catch (e){}
		}
	}
	else
	return false
		
	page_request.onreadystatechange = function(){
	loadpage(page_request, containerid);
	}
 
	page_request.open('GET', url, true);
	page_request.send(null);
}
 
function loadpage(page_request, containerid){
	if(page_request.readyState == 4 && (page_request.status == 200 || window.location.href.indexOf("http") == -1)){
		document.getElementById(containerid).innerHTML = page_request.responseText;
	}
}
 
/***Combo Menu Load Ajax snippet**/
function ajaxcombo(selectobjID, loadarea){
var selectobj = document.getElementById ? document.getElementById(selectobjID) : ""
	if(selectobj != "" && selectobj.options[selectobj.selectedIndex].value != ""){
		url = '<%=Request.ServerVariables("SCRIPT_NAME")%>?method=ajax&man-select=' + selectobj.options[selectobj.selectedIndex].value;
		ajaxpage(url, loadarea);
	}
}
 
</script>
<------------------------------- AJAX CALLED (END) ---------------------->
<------------------------------- FORM  ---------------------->
 <form name="frm-search" id="frm-search" method="get" action="<%=Request.ServerVariables("SCRIPT_NAME")%>">
<%
dbconnect(1)
ManufacturerID = ""
recCount = 0
Set RS=Server.CreateObject("ADODB.Recordset") 
RS.Open "SELECT DISTINCTROW ManufacturerID FROM troika_stock WHERE Show = true ORDER BY ManufacturerID ASC", strConnString, 3, 3 
						
 response.write("<select id=""man-select""" & "class=""searchbox-dd""" & "onchange=""ajaxcombo('man-select','content_model')""" & ">") 	
response.Write("<option selected=""selected""" & "class=""searchbox-dd-item""" & "value=""""" & ">" & "[ All Makes ]" & "</option>")
response.write("<optgroup label='Makes'"">")
if not RS.eof then
do while not RS.eof
If RS("ManufacturerID") <> ManufacturerID  then
 If ManufacturerID <> "" Then					
	
response.write ("<option value=""" & RS("ManufacturerID") & """" & "class=""searchbox-dd-item""" & ">" & RS("ManufacturerID") & "&nbsp;&nbsp;" & "(" & recCount & ")" & "</option>")
                         end if
ManufacturerID = RS("ManufacturerID")
recCount = 0 
end if
recCount = recCount + 1 
RS.movenext
loop
end if
response.write("</optgroup>")
response.write ("</select>")
 
RS.close
Set RS = Nothing
dbconnect(0)
%>
                        
<span id="content_model"><%Call getModels %></span>
</form>
<------------------------------- FORM (END) ---------------------->

Open in new window

Comment
Watch Question

Two thoughts to get you started here.  First off, I'm not sure you should be using hyphens in your html element names.  Certainly if you tried to directly access those elements (as opposed to through getElementById), it wouldn't work.  But if you don't know for sure that it's kosher, just try removing the hypen or using an underscore instead (e.g. man_select).

If that's not it, though, let's figure out where your problem is occurring.  Add a popup alert in your ajaxcombo() function to make sure you're calling the URL the way you think you are.  For example, right after you assign the url variable, but before you call ajaxpage(), put in:

window.alert(url);

Does it look right?
This one is on us!
(Get your first solution completely free - no credit card required)
UNLOCK SOLUTION

Author

Commented:
Thanks Bobaran98 for your help i resolved the problem, by putting the getmodels sub into a seperate page and called that in. So all sorted no more duplicating pages.

Gain unlimited access to on-demand training courses with an Experts Exchange subscription.

Get Access
Why Experts Exchange?

Experts Exchange always has the answer, or at the least points me in the correct direction! It is like having another employee that is extremely experienced.

Jim Murphy
Programmer at Smart IT Solutions

When asked, what has been your best career decision?

Deciding to stick with EE.

Mohamed Asif
Technical Department Head

Being involved with EE helped me to grow personally and professionally.

Carl Webster
CTP, Sr Infrastructure Consultant
Empower Your Career
Did You Know?

We've partnered with two important charities to provide clean water and computer science education to those who need it most. READ MORE

Ask ANY Question

Connect with Certified Experts to gain insight and support on specific technology challenges including:

  • Troubleshooting
  • Research
  • Professional Opinions
Unlock the solution to this question.
Join our community and discover your potential

Experts Exchange is the only place where you can interact directly with leading experts in the technology field. Become a member today and access the collective knowledge of thousands of technology experts.

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

OR

Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.