Question

I’m trying to get the code below working so that it will call a JS function to pass a value to my PHP file which will return a number of values from a MySQL database. This is part of an assignment I thought would be quite straightforward but I think my problem is with the JavaScript event handler – how to reference the input value maybe?

The HTML:

<form>
   <input type="text" name="users" onkeydown="showUser(this)"/>
</form>
        
<div id="txtHint">
    <p id="responder"><b>Person info will be listed here.</b></p>
</div>

The showUser() function:

<script type="text/javascript">
        function showUser(str)
        {
        if (str=="")
            {
            document.getElementById("responder").innerHTML="";
            return;
            } 
        if (window.XMLHttpRequest)
            {// code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp=new XMLHttpRequest();
            }
        else
            {// code for IE6, IE5
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
            }
        xmlhttp.onreadystatechange=function()
            {
            if (xmlhttp.readyState==4 && xmlhttp.status==200)
                {
                document.getElementById("responder").innerHTML=xmlhttp.responseText;
                }
            }
        xmlhttp.open("GET","php/student_query.php?q="+str,true);
        xmlhttp.send();
        }
    </script>

The PHP:

<?php
$q=$_GET["q"];
// Step 1
$conn = mysql_connect("localhost", "root");
// Step 2
mysql_select_db("collegeData", $conn);
//Step 3

$sql="SELECT * FROM studenttable WHERE studentID = '".$q."'";
$result = mysql_query($sql);

// Step 4
while ($row = mysql_fetch_array($result))
{
// Step 5
echo "Hello $row[firstName] $row[lastName]<br/>";
echo "Your two course modules are $row[moduleNo1] and $row[moduleNo2]<br/>";
echo "<tr><td> $row[firstName]</td><td> $row[lastName] </td> <td> $row[studentID] </td> </tr>";
echo "<br/>";
}
// Step 6
mysql_close($conn);
?>

Like I said, i think my problem is in the event handler, I’m not great with JS. I’d appreciate any help.

Answer 1

Looks like you’re sending the input element to your function, not it’s value. Try

<input type="text" name="users" onkeydown="showUser(this.value);" />

Also, you should protect your database query from protection by changing your PHP to

$q = mysql_real_escape_string(trim($_GET["q"]));
if($q == "")
{
    echo "";
    exit;
}