Hi friends this tutorial is about how to display data from database depending on selected drop down value in PHP. Normally have different ways for this work. Here i am using very simple way.
Through java script it is very simple to display data from database depending on selected drop down value.
In this tutorial i use a very simple example like when you select a class from drop down list then all the students of that particular class will display.
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("database_name", $con);
?>
<html>
<head>
<title>developerqueries.blogspot.com - Display data depending on selected drop down value</title>
</head>
<body>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<th>Class:</th>
<td>
<select name="select_class" id="select_class" onChange="show_student()">
<option value="-1">Select...</option>
<option value="1">One</option>
Through java script it is very simple to display data from database depending on selected drop down value.
In this tutorial i use a very simple example like when you select a class from drop down list then all the students of that particular class will display.
Now let's start the tutorial:
First of all we create three .PHP files.- connection.php // make connection to database
- index.php // for view class and students.
- get_student.php // get data from database and display on index.php file
Step 1:
In connection.php file write PHP script to make a connection from MySQL database.
Code
-----------------------------------------------------------------------
<?PHP
$con = mysql_connect("localhost","root","");
$con = mysql_connect("localhost","root","");
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("database_name", $con);
?>
---------------------------------------------------------------------------
Step 2:
In index.php file write the following HTML code.
Code
-------------------------------------------------------------------------------
<html>
<head>
<title>developerqueries.blogspot.com - Display data depending on selected drop down value</title>
</head>
<body>
<!--
bellow is java script code which call get_student.php file and display the result of get_student.php file.
-->
<script type="text/javascript">
function show_student()
{
var strclass=document.getElementsByName("select_class")[0].value;
document.getElementById("display_student").innerHTML="";
var xmlhttp;
if (window.XMLHttpRequest)
{
xmlhttp=new XMLHttpRequest();
}
else
{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("display_student").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","get_student.php?c="+strclass,true);
xmlhttp.send();
}
</script>
<script type="text/javascript">
function show_student()
{
var strclass=document.getElementsByName("select_class")[0].value;
document.getElementById("display_student").innerHTML="";
var xmlhttp;
if (window.XMLHttpRequest)
{
xmlhttp=new XMLHttpRequest();
}
else
{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("display_student").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","get_student.php?c="+strclass,true);
xmlhttp.send();
}
</script>
<!-- end java script code -->
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<th>Class:</th>
<td>
<select name="select_class" id="select_class" onChange="show_student()">
<option value="-1">Select...</option>
<option value="1">One</option>
<option value="2">Two</option>
</select>
</td>
</tr>
</table>
<div id="display_student">
</div>
</body>
</html>
</td>
</tr>
</table>
<div id="display_student">
</div>
</body>
</html>
----------------------------------------------------------------------------
Step 3:
In get_student.php file include a connection.php file for connect to database. and write a query that fetch the student of selected class and result will display using echo statement on index.php file.
Code
------------------------------------------------------------------------------------
<?PHP
include("connection.php");
$_val = $_REQUEST["c"];
if($_val=="-1")
{
return 0;
}
else
{
echo "<table border=1 width=50% cellpadding=0 cellspacing=0 >" ;
echo "<tr>";
echo "<th>Subjects</th>";
echo "</tr>";
$sql = "SELECT * FROM tbl_student where class_id = ".$_val;
$sql_result = mysql_query($sql,$con);
if($sql_result)
{
while($row=mysql_fetch_array($sql_result))
{
echo "<tr>";
echo "<td>";
echo $row["sub_name"] ;
echo "</td>";
echo "</tr>";
}
}
echo "</table>";
}
?>
include("connection.php");
$_val = $_REQUEST["c"];
if($_val=="-1")
{
return 0;
}
else
{
echo "<table border=1 width=50% cellpadding=0 cellspacing=0 >" ;
echo "<tr>";
echo "<th>Subjects</th>";
echo "</tr>";
$sql = "SELECT * FROM tbl_student where class_id = ".$_val;
$sql_result = mysql_query($sql,$con);
if($sql_result)
{
while($row=mysql_fetch_array($sql_result))
{
echo "<tr>";
echo "<td>";
echo $row["sub_name"] ;
echo "</td>";
echo "</tr>";
}
}
echo "</table>";
}
?>
--------------------------------------------------------------------------
Now run the index.php file and enjoy. Hope this tutorial will help full for all PHP programmers.
if i want to use two drop down in same page, what i can do?
ReplyDeletethank you for sharing useful post
ReplyDeleteweb programming tutorial
welookups