php 提交表单数据后，重定向页面上显示成功消息

pb3skfrl 于 2023-10-15 发布在 PHP

关注(0)|答案(2)|浏览(126)

我使用Localhost使用Xamp，我已经创建了HTML，CSS 3表单，也创建了一个PHP脚本文件，但当我点击表单提交按钮时，数据被发送到数据库，但表单当前页面被重定向到connect.php，并且在重定向页面上显示消息“新记录插入成功”。
虽然我想显示“新记录插入成功”消息在同一页上，也不希望重定向。
我的html代码

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" type="text/css" href="styles.css">
    <title>Form site</title>
</head>
<body>
    <form method="post" action="connect.php">
        <!-- Existing fields -->
        Cnic: <input type="number" name="cnic_number"><br><br>
        Name: <input type="text" name="name"><br><br>
        FIR No: <input type="text" name="fir_no"><br><br>
        FIR Date: <input type="date" name="fir_date"><br><br>
        Section: <input type="text" name="section"><br><br>
        Police Station: <input type="text" name="police_station"><br><br>
        Address: <textarea name="address"></textarea><br><br>

        <input type="submit" value="Submit">
    </form>
    <!-- Placeholder for success message -->
    <div id="message"></div>
</body>
</html>

PHP代码

<?php
$name = filter_input(INPUT_POST, 'name');
$cnic_number = filter_input(INPUT_POST, 'cnic_number');
$fir_no = filter_input(INPUT_POST, 'fir_no');
$fir_date = filter_input(INPUT_POST, 'fir_date');
$section = filter_input(INPUT_POST, 'section');
$police_station = filter_input(INPUT_POST, 'police_station');
$address = filter_input(INPUT_POST, 'address');

if (!empty($name) && !empty($cnic_number)) {
    $host = "localhost";
    $dbusername = "root";
    $dbpassword = "";
    $dbname = "mysite2";

    // Create connection
    $conn = new mysqli($host, $dbusername, $dbpassword, $dbname);

    if (mysqli_connect_error()) {
        die('Connect Error (' . mysqli_connect_errno() . ') ' . mysqli_connect_error());
    } else {
        // Prepare and execute the SQL query to insert data
        $sql = "INSERT INTO mysite2table (name, cnic_number, fir_no, fir_date, section, police_station, address)
                VALUES ('$name', '$cnic_number', '$fir_no', '$fir_date', '$section', '$police_station', '$address')";

        if ($conn->query($sql)) {
            echo "New record is inserted successfully";
        } else {
            echo "Error: " . $sql . " " . $conn->error;
        }
        $conn->close();
    }
} else {
    echo "cnic number and name should not be empty";
}
?>

我提交数据的时候看截图

提交后，页面被重定向到connect.php，消息也显示在重定向页面上

我的电脑文件夹截图

**注意：**我想在同一页“form.html”上显示“新记录插入成功”消息，也不想页面重定向到connect.php

我希望有人能帮助我，因为我被困在这里，我放弃了

php

来源：https://stackoverflow.com/questions/77261817/after-submit-the-form-data-success-message-display-on-redirected-page

2条答案

按热度按时间

vjrehmav1#

正如评论者建议的那样，你应该真正阅读AJAX请求，以便能够有效地使用它们。然而，这里有一些基本的代码，应该让你开始。
首先，我们希望保持表单实际提交，而是调用JavaScript函数：

<form method="post" action="connect.php" onsubmit="mySubmitForm(this, 'message'); return false;">

因此，当用户提交表单时，函数mySubmitForm被调用，通过返回false，表单将不会被浏览器提交。
然后我们需要一个JavaScript函数，它从表单中获取所有值，在AJAX请求中将它们提交到表单的action属性中给定的URL，然后将结果显示给用户：

async function mySubmitForm(form, result_container) {
    fetch(form.getAttribute('action'),
    {
        method: "POST",
        body: new FormData(form)
    })
    .then(response => response.text())
    .then(text => document.getElementById(result_container).innerHTML = text)
    .catch(error => console.error(error));
}

差不多就是这样了。然后，您的完整 form.html 将看起来像这样：

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" type="text/css" href="styles.css">
    <title>Form site</title>
</head>
<body>
    <form method="post" action="connect.php" onsubmit="mySubmitForm(this, 'message'); return false;">
        <!-- Existing fields -->
        Cnic: <input type="number" name="cnic_number"><br><br>
        Name: <input type="text" name="name"><br><br>
        FIR No: <input type="text" name="fir_no"><br><br>
        FIR Date: <input type="date" name="fir_date"><br><br>
        Section: <input type="text" name="section"><br><br>
        Police Station: <input type="text" name="police_station"><br><br>
        Address: <textarea name="address"></textarea><br><br>

        <input type="submit" value="Submit">
    </form>
    <!-- Placeholder for success message -->
    <div id="message"></div>
    <script>
        async function mySubmitForm(form, result_container) {
            fetch(form.getAttribute('action'),
            {
                method: "POST",
                body: new FormData(form)
            })
            .then(response => response.text())
            .then(text => document.getElementById(result_container).innerHTML = text)
            .catch(error => console.error(error));
        }
    </script>
</body>
</html>

赞(0）回复(0）举报 2023-10-15

vwkv1x7d2#

语句之后，在关闭php标记之前，

header('Location: http://www.yourwebsite.com/');

有时，您的目的地可以在您的网站内，在这种情况下，使用

header('Location: ../folder/file.ext');

其中../folder/file.ext是路径
如果你有很多重定向要做，创建一个函数

function redirect($path){

    header('Location: ' . $path);
}

表头取很多参数...这不是一个完整的解释。
要在重定向后显示邮件，请将邮件置于会话中。别忘了启动它。

$_SESSION['message'] = $message; // to add your value

和

echo "Your form was submitted successfully. Specific message : " . $_SESSION['message']; // to get your value

赞(0）回复(0）举报 2023-10-15

我来回答

php 提交表单数据后，重定向页面上显示成功消息

2条答案

相关问题

热门标签

最新问答