如何使用 HTML 和 PHP 将表单数据插入数据库

2025-06-04

如何使用 HTML 和 PHP 将表单数据插入数据库

收集客户表单数据是网站开发中的一项常见任务。联系表单可以让您的网站更专业,并清晰地传达出您有意与潜在客户开展业务的信号。缺乏联系表单可能会让您的业务显得过时或不专业。如果您的页面易于访问,人们更有可能光顾您的产品。这是提高您企业知名度的好方法。

实施联系表单的其他原因:

  1. 它使您的网站更加专业
  2. 安全
  3. 让自己更容易被联系到
  4. 自动回复电子邮件

今天,我们将学习如何使用 HTML 和 PHP 将客户表单数据插入 MySQL 数据库。我们将创建一个 HTML 表单和一个 PHP 脚本,使用 将数据插入数据库phpMyAdmin

先决条件:

指示:

举个例子,我们首先需要创建HTML表单。HTML 表单是一种存储用户与网站交互信息的文档。表单是用户向数据库发送信息的一种方式。



<form action="/action_page.php" method="POST">
  Form Elements...
</form> 


Enter fullscreen mode Exit fullscreen mode

action属性告诉表单将​​数据发送到哪里。该method属性告诉表单如何发送数据。

连接数据库

数据库是数据的集合。它是一种在计算机或服务器上存储和检索数据的方式。

Xampp 的全称是“扩展 Apache MySQL 平台”。它是一款免费的开源软件,允许您在计算机上运行数据库服务器。它使用 MySQL、Apache、PHP 和 Perl 作为数据库引擎,并且完全免费使用。

PHP代码示例:



<?php

// Set your connection variables
$servername = "localhost";
$username = "username";
$password = "password";
$dbname = "database_name";

// Create connection
$conn = new mysqli($servername,
    $username, $password, $dbname);

// Check connection
if ($conn->connect_error) {
    die("Connection failed: "
        . $conn->connect_error);
}
// Insert into appropriate table
$sqlquery = "INSERT INTO table VALUES
    ('John', 'Doe', 'john@example.com')"

// If the connection is successful, run the query
if ($conn->query($sql) === TRUE) {
    echo "record inserted successfully";

// If the query is not successful, display the error message
} else {
    echo "Error: " . $sql . "<br>" . $conn->error;
}
?>


Enter fullscreen mode Exit fullscreen mode

处理表单数据:

我们可以收集通过即将创建的 HTML 表单提交的表单数据。我们可以使用$_REQUEST变量来收集数据。



<?php

if ($_SERVER["REQUEST_METHOD"] == "POST") {

    // collect value of input field
    $data = $_REQUEST['val1'];

    if (empty($data)) {
        echo "data is empty";
    } else {
        echo $data;
    }
}

// Closing the connection.
$conn->close();

?>


Enter fullscreen mode Exit fullscreen mode

设置Xampp服务器

为了成功连接到数据库并发送表单数据,我们需要设置 Xampp 服务器来接受传入的数据:

  • 首先我们需要启动我们的 Xampp 服务器。
  • 导航至localhost/phpmyadmin
  • 创建一个名为 的数据库SampleDB和一个名为 的表SampleTable
  • 在代码编辑器中创建 HTML 和 PHP 文件。我使用的是Visual Studio Code
  • 通过我们创建的表单提交我们的数据。
  • 检查结果并验证所有数据是否已成功插入。

过程:

首先,您需要确保本地计算机上已安装XAMPP 服务器。安装完成后,我们首先打开 Xampp 应用程序。我使用的是 Macbook Pro,因此如果您使用的是 Windows 或其他操作系统,情况可能会有所不同。打开 Xampp 应用程序时,您需要确保以下服务已运行:

  1. MySQL 数据库
  2. Apache Web服务器

xampp-图像

现在我们可以导航localhost/phpmyadmin并创建数据库和表。

  • 点击New,然后输入数据库名称。我们将数据库命名为SampleDB。完成后,点击Create按钮。

创建示例数据库

接下来,我们可以创建要使用的表,名为SampleTable。确保将列数设置为 5。完成后,单击Create按钮。

样品表

现在我们的数据库和示例表已经创建,我们可以输入我们的列并单击保存。

确保为每一列输入正确的数据类型。

  • first_name
  • last_name
  • gender
  • address
  • email

VARCHAR此外,请确保为每个项目添加适当的类型。

表值

创建 HTML 表单

现在是时候创建我们的 HTML 表单了。我们将使用此表单将数据发送到数据库。

文件名:index.php



<!DOCTYPE html>
<html lang="en">
   <head>
      <title>Sample Form</title>
   </head>
   <body>
      <center>
         <h1>Storing Form data in Database</h1>
         <form action="insert.php" method="post">
            <p>
               <label for="firstName">First Name:</label>
               <input type="text" name="first_name" id="firstName">
            </p>
            <p>
               <label for="lastName">Last Name:</label>
               <input type="text" name="last_name" id="lastName">
            </p>
            <p>
               <label for="Gender">Gender:</label>
               <input type="text" name="gender" id="Gender">
            </p>
            <p>
               <label for="Address">Address:</label>
               <input type="text" name="address" id="Address">
            </p>
            <p>
               <label for="emailAddress">Email Address:</label>
               <input type="text" name="email" id="emailAddress">
            </p>
            <input type="submit" value="Submit">
         </form>
      </center>
   </body>
</html>


Enter fullscreen mode Exit fullscreen mode

创建 php 脚本

现在我们需要创建 PHP 脚本。该脚本将处理表单数据并将其插入数据库。

文件名:insert.php



<!DOCTYPE html>
<html>

<head>
    <title>Insert Page page</title>
</head>

<body>
    <center>
        <?php

        // servername => localhost
        // username => root
        // password => empty
        // database name => staff
        $conn = mysqli_connect("localhost", "root", "", "sampleDB");

        // Check connection
        if($conn === false){
            die("ERROR: Could not connect. "
                . mysqli_connect_error());
        }

        // Taking all 5 values from the form data(input)
        $first_name = $_REQUEST['first_name'];
        $last_name = $_REQUEST['last_name'];
        $gender = $_REQUEST['gender'];
        $address = $_REQUEST['address'];
        $email = $_REQUEST['email'];

        // We are going to insert the data into our sampleDB table
        $sql = "INSERT INTO sampleDB VALUES ('$first_name',
            '$last_name','$gender','$address','$email')";

        // Check if the query is successful
        if(mysqli_query($conn, $sql)){
            echo "<h3>data stored in a database successfully."
                . " Please browse your localhost php my admin"
                . " to view the updated data</h3>";

            echo nl2br("\n$first_name\n $last_name\n "
                . "$gender\n $address\n $email");
        } else{
            echo "ERROR: Hush! Sorry $sql. "
                . mysqli_error($conn);
        }

        // Close connection
        mysqli_close($conn);
        ?>
    </center>
</body>

</html>


Enter fullscreen mode Exit fullscreen mode

太棒了!现在我们可以将表单数据提交到数据库了,但首先我们需要将我们的index.phpinsert.php文件保存到htdocsXampp 目录下的文件夹中。

HTDOCS文件夹

我们可以通过打开 Xampp 应用程序然后单击来访问此文件夹Open Application Folder

打开文件夹

这将打开我们的 Xampp 文件目录。导航到该文件夹​​,并将你的和文件直接htdocs复制到此目录中。这将覆盖现有文件。现在我们可以填写表单并将其提交到我们的数据库。index.phpinsert.phplocalhost/index.php

存储表单于数据库

填写表格,然后点击submit。太好了!看来我们的数据已经成功存储在数据库中了。

表单提交

前往localhost/phpmyadmin并选择您的数据库以确保我们的数据已成功插入。

仪表板

结论

您刚刚完成了使用 HTML 和 PHP 将数据存储到数据库的基本步骤。现在,您可以使用此方法创建任何类型的表单,并将其附加到 phpMyAdmin 数据库。


🤝 非常感谢您抽出时间阅读这篇文章!希望它能对您有所帮助,并让您学到一些新东西!如果您有任何补充,请留言。我很乐意听取您的意见!

文章来源:https://dev.to/anthonys1760/how-to-insert-form-data-into-a-database-using-html-php-2e8
PREV
我的十大编程箴言
NEXT
你可以使用这些方法替换流行的框架!🔥