Question

我是新来的，所以我希望这是有道理的我是PHP和Ajax的新手......所以我很失落。

我有一个MySQL数据库设置，以及在PHP中创建的几个表单。我在其中一个表单上有几个文本字段，应该显示客户信息。第一个文本（phone＃）字段应该是一个搜索字段...所以我需要在用户完成输入电话号码后查询我的数据库，找到记录并填充剩余的字段。

我已经尝试过各种各样的方法......但是没有任何结果是正确的！似乎最有希望的方法是使用Onblur事件调用一个php页面（使用Ajax）来执行搜索。

此有效，因为我可以查询数据库以查找结果..并将它们显示回来。麻烦的是这个包含里面数据的页面实际显示在我的第一页中间...所以基本上我有一个网页显示在另一个内...这显然不是我想要的。

我的基本代码是：

HTML方面 -

    <script>
    function showUser(str) {
        if (str == "") {
            document.getElementById("divider").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) {
                document.getElementById("divider").innerHTML = xmlhttp.responseText;
            }
        }
        xmlhttp.open("GET", "GetCustomer.php?q="+str, true);
        xmlhttp.send();
    }
</script>
</head>
  <label for="CustPhone">Phone:</label>
  <input type="text" name="CustPhone" id="CustPhone" tabindex="1" onchange="showUser(this.value)" value="<?php  ?>">                   
    <br>
   <div id="divider"></div>

<label for="CustLastName">Last Name:</label>
   <input type="text" name="CustLastName" id="CustLastName" tabindex="2" value="<?php echo $clast;  ?>">
   &nbsp;&nbsp;&nbsp;&nbsp;
   <label for="CustFirstName">First Name:</label>
   <input type="text" name="CustFirstName" id="CustFirstName" tabindex="3" value="<?php echo $cfirst;  ?>">

   <p>&nbsp;</p>

   <label for="CustAddress1">Address 1:</label>
   <input type="text" name="CustAddress1" id="CustAddress1" tabindex="4" value="<?php echo $caddr1; ?>">

    &nbsp;&nbsp;&nbsp;&nbsp;
    <label for="CustAddress2">Address2:</label>
    <input type="text" name="CustAddress2" id="CustAddress2" tabindex="5" value="<?php echo $caddr2; ?>">

    <p>&nbsp;</p>

和PHP -

include ("AddEdit.php");
require_once("customer_info.php");

function LoadData()
{
$pn = $_POST['CustPhone'];

if (strlen($Pn) < 10)
{
    $query = "SELECT * FROM customer WHERE Phone='$Pn'";
    $result = mysql_query($query);

    if (!$result) die ("Database access failed: " . mysql_error());
    $rows = mysql_num_rows($result);
    $rowinfo = mysql_fetch_array($result); 

    if ($rows > 0)
    {
        $clast = $rowinfo['LastName'];
        $cfirst = $rowinfo['FirstName'];
        $caddr1 = $rowinfo['Address1'];
        $caddr2 = $rowinfo['Address2'];
        $ccity = $rowinfo['City'];
        $cprov = $rowinfo['Province'];
        $cpostal = $rowinfo['Postal'];
    }
}

}

关于如何在不跳过那么多的情况下做到这一点的任何想法...或者更重要的是只是在现有页面上显示数据，而不是在页面中显示我整个页面的较小版本？

THX !!!

Answer 1

首先，我建议使用jQuery ajax而不是旧的ajax。

我认为你的结果不正确，因为你在这行代码中使用“innerHTML”

document.getElementById("divider").innerHTML = xmlhttp.responseText;

所以你的结果会在那里。

Answer 2

我建议使用Jquery Ajax，这是一种更简单易用的Ajax方法有关详细信息，请参阅Jquery Ajax。因此，您可以按如下方式更改Ajax调用：

$.ajax({
            type: "POST",
            url:"GetCustomer.php",
            data: "q="+str,
            success : function(data) {
                //do someting with your data
                }
            }

        });

使用此功能，您可以处理错误状态，并在Ajax调用过程中显示“进行中”栏。

在成功中，您需要使用表单中的字段映射数据，而不是在div中显示它们。这是您在方法中唯一缺少的东西。所以不要跟随行 -

document.getElementById("divider").innerHTML = xmlhttp.responseText;

添加JS代码以使用字段映射数据。

您可以使用JSON数据类型并轻松地将数据映射到表单。

使用一个文本字段搜索数据库，然后在PHP中填充其余字段

2 个答案: