Question

我有一个可以将工作单信息添加到数据库的Web表单。我现在需要搜索该信息，但我需要将结果显示在提交表单的字段中。在第二次提交表单以更新数据库之前，用户必须能够更新这些“结果”字段中的一个或多个。我不能在服务器上添加一堆东西（比如AJAX）。这甚至可能吗？感谢。

<html>

<body>

<div id="naming" class="name-form">

<h3>Add name and click Submit.</h3>

    <form action="search3.php" method="POST">

        <fieldset>
            <label for="name">Name:</label> 
            <input type="text" name="name" size="20" /><br />
            <label for="id_number">ID Number:</label>
            <input type="text" name="id_number" size="20" /><br />
        </fieldset>

    <br/>

        <fieldset class="center">
            <input type="submit" value="Submit" />
        </fieldset>

    </form>

</div>

</body>

</html>

这两个脚本位于不同的文件中。

<?php

$con = mysqli_connect("localhost","root","","names");

// Check connection
if (mysqli_connect_errno())
  {
  echo "Failed to connect to MySQL: " . mysqli_connect_error();
  }

$name = trim($_REQUEST['name']);

$id_number = trim($_REQUEST['id_number']);

$insert_sql = "INSERT INTO names (name, id_number) VALUES ('{$name}', '{$id_number}')";

// Add name to database
mysqli_query($con, $insert_sql)
  or die(mysql_error());

?>

<meta http-equiv="refresh" content=".5; url=http://localhost/testforms/search3.html">

Answer 1

为此，您需要使用AJAX并使用它发送数据，接收响应并更新表单输入值。

<强> HTML

这里我们添加了听取＆＃34; onclick＆＃34;事件并将数据发送到＆＃34; search3.php＆＃34;

<form action="search3.php" method="POST">
    <fieldset>
        <label for="name">Name:</label> 
        <input class='formElements' type="text" name="name" size="20" /><br />
        <label for="id_number">ID Number:</label>
        <input class='formElements' type="text" name="id_number" size="20" /><br />
    </fieldset>
    <br/>
    <fieldset class="center">
        <input type="submit" value="Submit" onclick='sendData(); return false;'/>
    </fieldset>
</form>

<强>的JavaScript

这是AJAX函数，它获取表单元素值，将它们发送到服务器并以JSON格式接收响应数据。响应数据将插入到表单元素值中。

function sendData()
{
    var formElements = document.querySelectorAll(".formElement");
    var formData = new FormData(); 
    for(var i = 0; i < formElements.length; i++)
        formData.append(formElements[i].name, formElements[i].value);
    var xmlHttp = new XMLHttpRequest();
        xmlHttp.onreadystatechange = function()
        {
            if(xmlHttp.readyState === 4 && xmlHttp.status === 200)
            {
                var responseText = JSON.parse(xmlHttp.responseText);
                formElements[0].value = responseText[0];
                formElements[1].value = responseText[1];
            }
        }
        xmlHttp.open("POST", "search3.php"); 
        xmlHttp.send(formData);
}

<强> PHP

这里从AJAX函数中获取表单元素值。之后，将其插入数据库，获取last insert id以选择新输入的数据，并以JSON格式将其返回给客户端。

<?php 
    $name = $_POST["name"];
    $id = $_POST["id_number"];

    $con = new mysqli("localhost", "root", "", "names");

    $prepare = $con->prepare("INSERT INTO `names` (`name`, `id_number`) VALUES (?, ?); 
        $prepare->bind_param("ss", $name, $id); 
        $prepare->execute();
        $prepare->close();
     $lastInsertId = $con->insert_id;

    $prepareTwo = $con->prepare("SELECT `name`, `id_number` FROM `names` where `id` = ?); 
        $prepareTwo->bind_param("s", $lastInsertId);
        $prepareTwo->execute();
        $prepareTwo->store_result();
        $prepareTwo->bind_result($name, $id_number);
        $prepareTwo->fetch();
        $prepareTwo->close();

    $con->close();

        $responseArray = array();
        $responseArray[0] = $name;
        $responseArray[1] = $id_number;

        $responseArray = json_encode($responseArray);
        echo $responseArray;
?>

在网络提交表单中显示php搜索结果

1 个答案: