Last updated on January 28th, 2022 at 11:07 am
This is a simple tutorial on how to get a dropdown list value using simple ajax and php
Create a html page named country.html and add the below codes,
HTML CODE
<select name="country" onChange="getCurrencyCode('find_ccode.php?country='+this.value)">
<option value="">Select Country</option>
<option value="1">USA</option>
<option value="2">India</option>
<option value="3">Uk</option>
</select>
<input type="text" name="cur_code" id="cur_code" />
Javascript CODE
function getCurrencyCode(strURL)
{
var req = getXMLHTTP();
if (req)
{
//function to be called when state is changed
req.onreadystatechange = function()
{
//when state is completed i.e 4
if (req.readyState == 4)
{
// only if http status is "OK"
if (req.status == 200)
{
document.getElementById('cur_code').value=req.responseText;
}
else
{
alert("There was a problem while using XMLHTTP:\n" + req.statusText);
}
}
}
req.open("GET", strURL, true);
req.send(null);
}
}
Now create a PHP file named code.php and add the below code,
<?php
$country=$_REQUEST['country'];
switch($country)
{
case "1" :
echo "USD";
break;
case "2" :
echo "Rupees";
break;
case "3" :
echo "Pound";
break;
}
?>
THATS IT!!!!!!!!!!!!!!!!
As you can see its pretty simple to understand this tutorial.
instead of var req = getXMLHTTP();
write var req = new XMLHttpRequest();
Great!! This is good example for dynamic drop down menu using jQuery. It just made my work easier. It saved lot if time. This was so easy to follow and exactly what I was looking for.
Thanks.