infolink

Saturday, 11 January 2014

Display data from database depending on selected drop down value

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.

Now let's start the tutorial:

First of all we create three .PHP files.
  1. connection.php   // make connection to database
  2. index.php           // for view class and students.
  3. 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","");
 
    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>
<!-- 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>
 ----------------------------------------------------------------------------

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>";
}

?>
--------------------------------------------------------------------------
Now run the index.php file and enjoy. Hope this tutorial will help full for all PHP programmers.

1 comment:

  1. if i want to use two drop down in same page, what i can do?

    ReplyDelete