AJAX数据查找不起作用 - AJAX data find does not work

我有这些代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
        <title>Display data in textboxes</title>
<style type="text/css"><!-- Style Sheet part start -->
html {
    overflow:auto;
}
body {
    background-color:#FFFFFF;
    margin:0 auto;
}
#mypopup
{
    float: left;
    width: 250px; height: 350px;
    background-color:#d5eef4 ;
    border: 1px solid #069;
    text-align:center;
    padding:2px;
    margin-top:150px;
    margin-left:100px;
    overflow:auto;
}
#header
{
    background-color:#3399FF;
    background-position:left center;
    line-height:25px;
    font-size:22px;
    color:#FFFF33;
    font-weight:600;
    border-bottom:1px solid #6699CC;
    padding:10px;
}
</style> <!-- Style Sheet part end -->
</head>
<body>
    <center>
        <div id="mypopup">
            <div id="header">Search Data</div>
                <div style="margin-top:80px;">
                    <form name="form1" action="#" method="post">
                        <table border=0; cellpadding="1" cellspacing="1" bgcolor="#CCFFFF" align="center" >
                            <tr>
                                <th>Code</th>
                                <th width="50px"><input type="text" name="txtsno" id="txtsno" value="" title="Enter product code" /></th>
                            </tr>
                            <tr>
                                <td>Product</td>
                                <td><input type="text" name="txtpro" id="txtpro" value="" title="Enter product name" ></td>
                            </tr>
                        </table>
<input type="button" name="button1" value="Display" onclick="send();">
                        <input type="reset" name="button2" value="Clear" >
                    </form>
                </div>
            </div>
    </center>
<script type="text/javascript"><!-- Javascipt starts -->
var xmlhttp = new XMLHttpRequest();
function send(){
    var Pcode = document.getElementById("txtsno").value;
    xmlhttp.onreadystatechange=function(){
        if (xmlhttp.readyState==4 && xmlhttp.status==200){
            document.getElementById("txtpro").value = xmlhttp.responseText;
        }
    }
xmlhttp.open("POST","test2.php",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("data="+Pcode);
}
</script><!-- Javascript end -->
</body>
</html>

test.php有以下代码

<?php
require_once("connect.php");
$code = $_POST['data'];
$record_check = "SELECT packing FROM test WHERE sno = '$code' ";
$result=mysqli_query($con, $record_check);
$row = mysqli_fetch_array($result);
if(!$row)
die ('No record Found');
else {
    $productValue = $row['packing'];
}
echo $productValue;
?>

当我按下DISPLAY按钮时，此数据显示在txtpro 中

注意：未定义的变量：第5行C:''wamp''www''db''test2.php中的代码未找到记录

我做错了什么？请帮助我

尝试这个

function send(){
    var Pcode = document.getElementById("txtsno").value;
    var parameters = "data="+Pcode;
    xmlhttp.onreadystatechange=function(){
        if (xmlhttp.readyState==4 && xmlhttp.status==200){
            document.getElementById("txtpro").value = xmlhttp.responseText;
        }
    }
    xmlhttp.open("POST","test2.php",true);
    xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
    xmlhttp.setRequestHeader("Content-length", parameters .length);
    xmlhttp.setRequestHeader("Connection", "close");
    xmlhttp.send(parameters);
}

也可以将encodeURIComponent用于变量

if(isset($_POST['data'])){
    $code = $_POST['data'];
    $record_check = "SELECT packing FROM test WHERE sno = '$code' ";
    $result=mysqli_query($con, $record_check);
    $row = mysqli_fetch_array($result);
    if(!$row)
        echo 'No record Found';
    else {
        echo $row['packing'];
    }
}