IER506 Posted July 24, 2010 Share Posted July 24, 2010 Good morning to everyone. I've started studying ajax these days but I'm stuck in something! What I was trying to achieve is the following: 1.When the page loads a php function is called and a <select> menu is generated. 2.Then I generate another <select> menu via ajax. A simple js function sends the value of the menu in step one to a php script and as a reply I have my new menu. 3.Then I want a third menu to be generated via ajax again. I want to send the previous two values to another php script and get the menu as a reply. Also I want the following two things to happen: 4.When I change the first,the values of the second and the third should change. 5.When I change the second, the values of the third should change. Steps 1 and 2 work fine!Step 4 works partially(only the second menu is updated). I think it should be easy but my brain is stuck! This is my code: <?php //here I call the function for the first menu! include 'functions/menu1.php'; ?> <html> <head> <script type="text/javascript"> function updateorg() { 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) { document.getElementById("org").innerHTML=xmlhttp.responseText; } } var des = document.getElementById('des').value; xmlhttp.open("GET","org_ajax.php?ut=users&us=test&de="+des,true); xmlhttp.send(); } </script> <script type="text/javascript"> function updatetype() { 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) { document.getElementById("type").innerHTML=xmlhttp.responseText; } } var des = document.getElementById('des').value; var org = document.getElementById('org').value; xmlhttp.open("GET","menu_types_db_ajax.php?ut=users&us=george&de="+des+"&or="+org,true); xmlhttp.send(); } </script> </head> <body onLoad="updateorg();"> <form> MENU 1: <select name="des" id="des" onchange="updateorg()"> <?php generate_destination_menu_bydb(localhost,george,123456,main,maindb,users,george); ?> </select><br> MENU 2: <select name="org" id="org" > </select><br> MENU 3: <select name="typ" id="type"> </select> </form> </body> </html> I've tried to use onchange="updatetype()" to some elements but the results are the same. I cannot achieve what I want! Any help is really appreciated. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.