Jump to content

multiple combo box using ajax and php


zohab

Recommended Posts

hi all

 

I have one combo box with country names .

I have another combo box with country states.

 

I need to show values in country states combo box depending on the country name

selected in country names combo box.

 

I need to implement this using ajax and php??

 

 

best regards

zohab

 

 

Link to comment
https://forums.phpfreaks.com/topic/54260-multiple-combo-box-using-ajax-and-php/
Share on other sites

hi all

 

check this code

instead of project name use country table and replace task table with state .

 

 

dynamicdropdown.php

<?

include("mysqlconnect.php"); 

 

$db='universus';

mysql_select_db($db);

 

?>

 

 

 

 

 

<html>

<head>

<script src="selectcustomer.js"></script>

</head>

 

<body>

 

<form>

Select a Project Name:

<? $sql_sel="select * from prjmaster";

$res=mysql_query($sql_sel);

?>

<select name="prjname" onchange="showCustomer(this.value)">

<?

while($row1=mysql_fetch_array($res)){

 

echo "<option " .$select. " value='".$row1['prjID']."'>".$row1['prjName']."</option>";

}

echo "</select>";

?>

</form>

 

<p>

<div id="txtHint"><b>Task info will be listed here.</b></div>

</p>

 

</body>

</html>

 

<script language="javascript">

var xmlHttp

 

function showCustomer(str)

{

xmlHttp=GetXmlHttpObject();

if (xmlHttp==null)

  {

  alert ("Your browser does not support AJAX!");

  return;

  }

var url="gettask.php";

url=url+"?q="+str;

url=url+"&sid="+Math.random();

xmlHttp.onreadystatechange=stateChanged;

xmlHttp.open("GET",url,true);

xmlHttp.send(null);

}

 

function stateChanged()

{

if (xmlHttp.readyState==4)

{

document.getElementById("txtHint").innerHTML=xmlHttp.responseText;

 

//alert(document.getElementById("txtHint").innerHTML);

 

}

}

 

function GetXmlHttpObject()

{

var xmlHttp=null;

try

  {

  // Firefox, Opera 8.0+, Safari

  xmlHttp=new XMLHttpRequest();

  }

catch (e)

  {

  // Internet Explorer

  try

    {

    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");

    }

  catch (e)

    {

    xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");

    }

  }

return xmlHttp;

}

</script>

 

gettask.php

<?

include("mysqlconnect.php"); 

 

$db='universus';

mysql_select_db($db);

 

$id=$_REQUEST['q'];

//echo "$id";

$sql_task="select * from prjtaskdetail where prjID='".$id."'";

$query2=mysql_query($sql_task);

 

echo "<select name='prjtask'>";

 

while($row2 = mysql_fetch_array($query2)){

echo "<option value='".$row2['taskID']."'>".$row2['Description']."</option>";

}

echo "</select>";

 

 

?>

 

 

 

 

 

bye

  • 1 year later...

file1

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<title>Untitled Document</title>
<script language="javascript">
var xmlHttp

function showCustomer(str)
{
xmlHttp=GetXmlHttpObject();
if (xmlHttp==null)
  {
  alert ("Your browser does not support AJAX!");
  return;
  }

var url="file2.php";
url=url+"?q="+str;
//url=url+"&sid="+Math.random();
alert(url);


xmlHttp.onreadystatechange=stateChanged;
xmlHttp.open("GET",url,true);
xmlHttp.send(null);
}

function stateChanged()
{
if (xmlHttp.readyState==4)
{
document.getElementById("txtHint").innerHTML=xmlHttp.responseText;

//alert(document.getElementById("txtHint").innerHTML);

}
}

function GetXmlHttpObject()
{
var xmlHttp=null;
try
  {
  // Firefox, Opera 8.0+, Safari
  xmlHttp=new XMLHttpRequest();
  }
catch (e)
  {
  // Internet Explorer
  try
    {
    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
    }
  catch (e)
    {
    xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
  }
return xmlHttp;
}
</script>

</head>

<body>


<form action="" method="get" enctype="multipart/form-data" name="frmAjax" id="frmAjax">

<table width="100" border="1">
  <tr>
    <td>Country</td>
    <td>
<select name="country" id="country" onchange="showCustomer(this.value)">
 <option value="1">India</option>
 <option value="2">United States</option>
    </select>

</td>
  </tr>
  <tr>
    <td>State</td>
    <td><p><div id="txtHint">
<select name="state" id="state" style="width:110px; ">
			 <option value="0">Select</option>
      </select>
</div>
</p></td>
  </tr>
</table>

</form>

</body>
</html>

 

file2

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<title>Untitled Document</title>
</head>
<body>

<form action="" method="post" enctype="multipart/form-data">
<table width="100" border="1">
  <tr>
    <td>
<select name="state" id="state">
			 <?php if($_REQUEST['q']=="1") {  ?>
			 <option  value="" >Maharasthra</option>
			 <?php } ?>
			 <?php if($_REQUEST['q']=="2") {  ?>
			 <option  value="">California</option>
			 <?php } ?>
      </select>
  </td>
  </tr>
</table>
</form>

</body>
</html>


  • 1 year later...

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.