Jump to content

Ajax and php dynamic drop down


Panta

Recommended Posts

Please brothers i really need help on this, i have a script that populates from database, but my problem is that it will refresh for the records in the second selction box to occur and this makes the form in puts to drop, so i searched for way out and discovered i can achieve that with Ajax, but i have tried many scipts i found and none is working, am not good at ajax, so i decided to bring it forth for analysis. thanks these are my secipts, is meant to populate 3 drops down selection box. but it doesnt work

 

ajax-dd3.php

<!doctype html public "-//w3c//dtd html 3.2//en"><html><head><title></title><META NAME="DESCRIPTION" CONTENT=""><META NAME="KEYWORDS" CONTENT=""><script type="text/javascript">function ajaxFunction(choice){var httpxml;try  {  // Firefox, Opera 8.0+, Safari  httpxml=new XMLHttpRequest();  }catch (e)  {  // Internet Explorer  try    {    httpxml=new ActiveXObject("Msxml2.XMLHTTP");    }  catch (e)    {    try      {      httpxml=new ActiveXObject("Microsoft.XMLHTTP");      }    catch (e)      {      alert("Your browser does not support AJAX!");      return false;      }    }  }function stateChanged()     {    if(httpxml.readyState==4)      {//alert(httpxml.responseText);var myObject = JSON.parse(httpxml.responseText);for(j=document.myForm.state.options.length-1;j>=0;j--){document.myForm.state.remove(j);}var state1=myObject.value.state1;var optn = document.createElement("OPTION");optn.text = 'Select State';optn.value = '';document.myForm.state.options.add(optn);for (i=0;i<myObject.state.length;i++){var optn = document.createElement("OPTION");optn.text = myObject.state[i];optn.value = myObject.state[i];document.myForm.state.options.add(optn);if(optn.value==state1){var k= i+1;document.myForm.state.options[k].selected=true;}} //////////////////////////for(j=document.myForm.city.options.length-1;j>=0;j--){document.myForm.city.remove(j);}var city1=myObject.value.city1;//alert(city1);for (i=0;i<myObject.city.length;i++){var optn = document.createElement("OPTION");optn.text = myObject.city[i];optn.value = myObject.city[i];document.myForm.city.options.add(optn);if(optn.value==city1){document.myForm.city.options[i].selected=true;}} ///////////////////////////document.getElementById("txtHint").style.background='#00f040';document.getElementById("txtHint").innerHTML='done';//setTimeout("document.getElementById('txtHint').style.display='none'",3000)    }    }var url="ajax-dd3ck.php";var country=myForm.country.value;if(choice != 's1'){var state=myForm.state.value;var city=myForm.city.value;}else{var state='';var city='';}url=url+"?country="+country;url=url+"&state="+state;url=url+"&city="+city;url=url+"&id="+Math.random();myForm.st.value=state;//alert(url); document.getElementById("txtHint2").innerHTML=url;httpxml.onreadystatechange=stateChanged;httpxml.open("GET",url,true);httpxml.send(null); document.getElementById("txtHint").innerHTML="Please Wait....";document.getElementById("txtHint").style.background='#f1f1f1';}</script></head></head><body><div id="txtHint" style="width : 100px;background-color: #cccc33;">Message area</div><br><br><form name="myForm" action='ajax-dd3-details.php' method='post'><input type='hidden' name='st' value=0><table width=500><tr><td >Select Country<br><select name="country" id='s1' onchange="ajaxFunction('s1');"><option value=''>Select One</option><?Php//require "../include/z_db1.php";require "config.php";// connection to database $sql="select distinct country from student5 ";foreach ($dbo->query($sql) as $row) {echo "<option value=$row[country]>$row[country]</option>";}?></select></td><td ><select name="state"  onchange="ajaxFunction('s2');"><option value=''>Select One</option></select></td><td ><select name="city"  onchange="ajaxFunction('s3');"><option value=''>Select One</option></select></td></tr></tr><tr><td colspan=3><input type="submit" value='Submit'></td></tr></table></form><br><br><div id="txtHint2"></div></body></html>

ajax-dd3ck.php

<?Phprequire "config.php"; // connection detailserror_reporting(0);// With this no error reporting will be there///////////////////////////////////////////////////////////////////////////////////////$country=$_GET['country'];// //$country='IND'; // To check you can use this$state1=$_GET['state'];$city1=$_GET['city'];//$state1="Andhra Pradesh";///////////// Validate the inputs ////////////// Checking country variable ///if((strlen($country)) > 0 and (!ctype_alpha($country))){ echo "Data Error";exit;}// Checking state variable (with space ) ///if ((strlen($state1)) > 0 and ctype_alpha(str_replace(' ', '', $state1)) === false) {echo "Data Error";exit;}/////////// end of input validation //////if(strlen($country) > 0){$q_country="select distinct(state) from student5 where country = '$country'";}else{$q_country="select distinct(state) from student5";}//echo $q_country;$sth = $dbo->prepare($q_country);$sth->execute();$state = $sth->fetchAll(PDO::FETCH_COLUMN);$q_state="select distinct(city) from student5 where  ";if(strlen($country) > 0){$q_state= $q_state . " country = '$country' ";}if(strlen($state1) > 0){$q_state= $q_state . " and  state='$state1'";}$sth = $dbo->prepare($q_state);$sth->execute();$city = $sth->fetchAll(PDO::FETCH_COLUMN);$main = array('state'=>$state,'city'=>$city,'value'=>array("state1"=>"$state1","city1"=>"$city1"));echo json_encode($main); ////////////End of script /////////////////////////////////////////////////////////////////////////////////?>

thanks

Link to comment
Share on other sites

What happens when you run the code? Are you checking for Javascript errors in your browser's developer console?

it does not change the second select box, i don;t check please how do i check?

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...