pingarjun Posted April 9, 2012 Share Posted April 9, 2012 Hi, I am new to AJAX and started exploring basics. I've three select lists and when we select values in the lists and click on submit button need call PHP using AJAX .Here the problem is am not able to communicate with PHP from AJAX. <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="generator" content="CoffeeCup HTML Editor (www.coffeecup.com)"> <meta name="created" content="Sat, 07 Apr 2012 14:09:20 GMT"> <meta name="description" content=""> <meta name="keywords" content=""> <title>Job Search</title> <!--[if IE]> <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> <style type="text/css"> th {font-family:arial;font-size:15px;} button{color:#787878;} body{bgcolor:#E0E0E0;} </style> <script type="text/javascript"> function showJobs(form) { var sk=form.skill.value; var ex=form.exp.value; var lo=form.loc.value; 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("Grid").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","fetchdetails.php?q="+sk+"&q="+ex+"&r="+lo,true); xmlhttp.send(); } </script> </head> <body> <div id="Job Search" style="text-align:left;"> <div id="Search"> <form name="jsearch" method="post"> <table> <tr> <th>Technology</th> <th>Experiance</th> <th>Location</th> </tr> <tr> <td> <select name="skill"> <option value="">Select a Skill:</option> <option value="1">TIBCO</option> <option value="2">Webmethods</option> <option value="3">PEGA</option> </select> </td> <td> <select name="exp"> <option value="">Select a Exp:</option> <option value="1">0-1</option> <option value="2">1-2</option> <option value="3">2-3</option> </select> </td> <td> <select name="loc"> <option value="">Select a Location</option> <option value="1">Bangalore</option> <option value="2">Chennai</option> <option value="3">Hyderabad</option> </select> </td> <td> <button value="SearchJobs" color="blue" onclick="showJobs(this.form)">Search Jobs</button> </td> </tr> </table> </form> </div> <div id="Grid"> The Grid Page goes Here </div> </div> </body> </html> Please some one help on this issue. Thanks, Arjun Quote Link to comment Share on other sites More sharing options...
AyKay47 Posted April 9, 2012 Share Posted April 9, 2012 at first glance the script looks to be fine, except you specify q twice in the query string. What happens when the script is ran? Have you tried debugging the script using alert()s? Quote Link to comment Share on other sites More sharing options...
caliux Posted April 10, 2012 Share Posted April 10, 2012 Try firefox web developer console or firebug Quote Link to comment Share on other sites More sharing options...
pingarjun Posted April 10, 2012 Author Share Posted April 10, 2012 Hi, Thanks for your quick response.As per your suggestion tried in webconsole and unable to find more info to debug. Please find the attached screenshot. Quote Link to comment Share on other sites More sharing options...
pingarjun Posted April 10, 2012 Author Share Posted April 10, 2012 I have tested the same in IE and got expected response,but in firefox it is not working. Please let me know if there is any issue in the code. Quote Link to comment Share on other sites More sharing options...
AyKay47 Posted April 10, 2012 Share Posted April 10, 2012 certain browsers will stop parsing when an error is encountered. As the error says, bgcolor is not a valid css property, background-color is. body{background-color:#E0E0E0;} //change accordingly 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.