Question

我正在学习php，html和ajax。我已经用员工信息构建了一个MySQL数据库。我已经设法弄清楚如何使用ajax自动填充文本框（称为员工详细信息）。当您开始键入员工的姓名时，它将填充其全名和公司名称的串联。

我现在要做的是根据第一个文本框的值自动填充第二个文本框及其员工ID。

我搜索了很多问题和教程，但我找不到如何做到这一点的简单解释，我发现的例子不包括php，ajax，html，我无法弄清楚如何将它们拼凑在一起（我不是一个编码天才，我不能让任何一个例子工作）。现在我已经被困在这几个小时了，失去了活着的意志！

我真的很感激，如果有人可以帮我解决一个简单的解释，在一个地方有一个php，ajax和html的例子！

到目前为止，这是我的代码。

form.php的

<link rel="stylesheet"        href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

<script>
$(function() {
    $( "#employeedetails" ).autocomplete({
        source: 'search.php'
    });
});
</script>

<div class="form-group">
<b class="text-primary">Employee details:</b>
<input type="text" class="form-control" value="" id="employeedetails" name="employeedetails" required>

<b class="text-primary">Id:</b>
<input type="text" name="employeeid" id="employeeid" placeholder="employeeid"/>
</div>

的search.php

include 'dbconnect.php';

    //get search term
    $searchTerm = $_GET['term'];

    //get matched data from employee table
    $query = $conn->query("SELECT * 
                         FROM employees 
                         WHERE (firstname LIKE '%".$searchTerm."%')
                            OR (surname LIKE '%".$searchTerm."%')
                            OR (companyname LIKE '%".$searchTerm."%')
                         ORDER BY firstname ASC

                        ");
    while ($row = $query->fetch_assoc()) {
        $data[] = $row['firstname'] . " " . $row['surname'] . " - " .     

    }

    //return json data
    echo json_encode($data);
?>

Answer 1

假设您的HTML员工详细信息文本框具有id =“employeeDetail”并且您的HTML员工ID文本框具有id =“employeeId”，您可以使用jQuery收听选择的员工详细信息，然后通过Ajax发送该选择，并使用Ajax响应更新Employee Id文本框的值。这将涉及以下jQuery和PHP代码：

jQuery代码：

    $(document).ready(function(){
        $(#employeeDetail).on("change", function(){ //use an appropriate event handler here
             $.ajax({
                 method: "POST",
                 url: "getEmployeeId.php",
                 data: {
                    employee_detail: $("#employeeDetail").val(),
                 },
                 success: function(response){
                    if (response == "FALSE") {
                        var message = "ERROR: something went wrong on the MYSQL side";
                        alert(message);
                    } else {
                        $("#employeeId").val(response);
                    }
                 },
                 error: function(jqXHR, textStatus, errorThrown){
                    var message: "ERROR: something went wrong with the AJAX call - " + textStatus + " - " + errorThrown;
                    alert(message);
                 }
              });
         });
    });

PHP代码（getEmployeeId.php）：

    //set $server, $user, $password and $database_name, then establish the connection:
    $conn = new mysqli($server, $user, $password, $database_name);
    if ($conn->connect_error) {
        exit("FALSE");
    }
    //get employee detail from POST (sent via AJAX):
    $employee_detail = $_POST["employee_detail"];
    //here, you should test whether employee_detail matches what you expect
    //here, split $employee_detail into $first_name, $last_name and $company_name
    //now you are ready to send the MYSQL query:
    $sql = 'SELECT employeeid FROM tablename WHERE firstname = "$first_name" AND surname = "$last_name" AND companyname = "$company_name"';
    //since you expect a single matching result, you can test for num_rows == 1:
    if ((! $result = $_conn->query($sql)) || ($result->num_rows !== 1)) {
        exit("FALSE");
    } else {
        while ($row = $result->fetch_assoc()) {
            $employee_id = $row['id'];
        }
    }
    //now send $employee_id back to the AJAX call:
    echo $employee_id;

如何使用Ajax基于另一个文本框的值填充表单输入文本框

1 个答案: