• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 775
  • Last Modified:

Chained Select Menus + Load AJAX content

Hi Experts,

I am using a script from Dynamic Drive (View script here) to have chained select menus.

In the example I have attached, I have set this up with 2 chained menus and it all works fine, I can easily make the final select menu take the user to a new page however I am trying to make the final selection load in a HTML page inside a div within the same page as opposed to leaving this page.

I am a very weak coder and hoping one of you great experts may be able to assist with this in some way.

Any help at all would be greatly appreciated.
sample.zip
0
mobius1980
Asked:
mobius1980
  • 3
  • 2
1 Solution
 
Gurvinder Pal SinghCommented:
In the 'goListGroup' method of chainedmenu.js, you need to make the ajax call rather than using window.location or window.open.

for making ajax call see
http://www.w3schools.com/ajax/default.asp
http://www.ajaxtutorial.net/
0
 
mobius1980Author Commented:
I'm sorry, you lost me... When I said I am a weak coder, I mean very weak coder.  :-)

I presume you mean between line 26 and 30?


else if (newwindow==1)
window.open(selectedOptionvalue)
else
window.location=selectedOptionvalue
break

Open in new window

0
 
Gurvinder Pal SinghCommented:
Yes, instead of these, you have to make an ajax call to these locations.
0
 
mobius1980Author Commented:
Ok, I'm still no closer to a result here... I apologise for being a pain, I'm not asking you to write the code for me but I am simply lost. Everything I have tried just either loads a new page or does nothing.

Anybody else able to provide a little assistance for a complete n00b like myself?  :-)
0
 
Gurvinder Pal SinghCommented:
this is how you make a simple ajax request
http://www.w3schools.com/ajax/tryit.asp?filename=tryajax_first
Use the following code


function makeAJAXCall(url)
{
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    { 
    //this is where the ajax response will be loaded. you can change it to do something else with the ajax response
    document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET",url,true);
xmlhttp.send();
}

Open in new window

0

Featured Post

Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now