主窗体未返回主页

问题描述 投票：0回答：1

我的身材很小。我正在尝试同时保存表单数据和打印。它工作正常，但问题是我的主表单在单击提交按钮后没有返回主页。下面是我的代码

表格

<!DOCTYPE html>
<html>
<head>
    <title>Save and Print Form Data</title>
</head>
<body>
    <form id="myForm" action="process.php" method="post">
        <label for="name">Name:</label>
        <input type="text" id="name" name="name" required><br><br>
        
        <label for="email">Email:</label>
        <input type="email" id="email" name="email" required><br><br>
        
        <button type="submit">Save and Print</button>
    </form>
   




    <script>
        // JavaScript to handle form submission and printing
        document.getElementById('myForm').onsubmit = function() {
            // Open a new window to display the print view
            var printWindow = window.open('', '_blank');
            
            // Submit the form to process.php
            this.target = '_blank';
            
            // After submission, close the print window after a delay (adjust timing as needed)
            setTimeout(function(){
                printWindow.close();
            }, 5000); // 5000 milliseconds (5 seconds) delay to allow printing
            
            return true;
        };
    </script>

</body>
</html>

这是process.php文件

<?php
// Check if form is submitted
if ($_SERVER["REQUEST_METHOD"] == "POST") {
    // Retrieve form data
    $name = $_POST['name'];
    $email = $_POST['email'];
    
    // Insert data into MySQL database (assuming you have a table 'users' with columns 'name' and 'email')
    $servername = "localhost";
    $username = "root";
    $password = "";
    $dbname = "aaa";
    
    // Create connection
    $conn = new mysqli($servername, $username, $password, $dbname);
    
    // Check connection
    if ($conn->connect_error) {
        die("Connection failed: " . $conn->connect_error);
    }
    
    // SQL query to insert data
    $sql = "INSERT INTO users (name, email) VALUES ('$name', '$email')";
    
    if ($conn->query($sql) === TRUE) {
        // Data inserted successfully
     
        
        // Print the data immediately after saving (you can customize the print view as needed)
        echo "<h2>Print Preview</h2>";
        echo "<p>Name: $name</p>";
        echo "<p>Email: $email</p>";
        
        // Add a button to trigger printing
        echo "<button onclick='window.print()'>Print</button>";
    } else {
        echo "Error: " . $sql . "<br>" . $conn->error;
    }
 
    $conn->close();
}
?>

我尝试了标题

header("location: ../padm.php");    
exit;

但不是表单页面，而是将打印页面发送到标题位置

javascript php forms printing
1个回答
0
投票

我已经设计了一个解决方案来解决您的问题，即单击提交按钮后表单不显示并重定向回主页，该解决方案使用 HTML 和 JavaScript 进行表单呈现和执行，并使用 PHP 处理提交的数据，以便它能够正确显示。我将逐步引导您完成此解决方案，以便您可以轻松了解其中的每个细节。

为了解决提交表单数据后主表单没有返回首页的问题，我们应该妥善处理表单提交和后续操作。这是 PHP 和 JavaScript 的详细解决方案；

HTML 表单 (index.html)

    <!DOCTYPE html>
<html>
<head>
    <title>Save and Print Form Data</title>
</head>
<body>
    <form id="myForm" action="process.php" method="post">
        <label for="name">Name:</label>
        <input type="text" id="name" name="name" required><br><br>
        
        <label for="email">Email:</label>
        <input type="email" id="email" name="email" required><br><br>
        
        <button type="submit">Save and Print</button>
    </form>

    <script>
        document.getElementById('myForm').onsubmit = function(event) {
            // Open a new window to display the print view
            var printWindow = window.open('', '_blank');
            
            // Submit the form to process.php
            this.target = '_blank';
            
            // After submission, close the print window after a delay (adjust timing as needed)
            setTimeout(function(){
                printWindow.close();
                // Redirect back to the home page after processing
                window.location.href = 'index.html'; // Replace with your home page URL
            }, 5000); // 5000 milliseconds (5 seconds) delay to allow printing
            
            // Prevent the default form submission
            event.preventDefault();
        };
    </script>
</body>
</html>

PHP 处理脚本 (process.php)

<?php
// Check if form is submitted
if ($_SERVER["REQUEST_METHOD"] == "POST") {
    // Retrieve form data
    $name = $_POST['name'];
    $email = $_POST['email'];
    
    // Insert data into MySQL database (assuming you have a table 'users' with columns 'name' and 'email')
    $servername = "localhost";
    $username = "root";
    $password = "";
    $dbname = "aaa";
    
    // Create connection
    $conn = new mysqli($servername, $username, $password, $dbname);
    
    // Check connection
    if ($conn->connect_error) {
        die("Connection failed: " . $conn->connect_error);
    }
    
    // SQL query to insert data (use prepared statements for security)
    $sql = "INSERT INTO users (name, email) VALUES (?, ?)";
    
    // Prepare and bind parameters
    $stmt = $conn->prepare($sql);
    $stmt->bind_param("ss", $name, $email);
    
    // Execute the statement
    if ($stmt->execute()) {
        // Data inserted successfully
        
        // Print the data immediately after saving (you can customize the print view as needed)
        echo "<h2>Print Preview</h2>";
        echo "<p>Name: $name</p>";
        echo "<p>Email: $email</p>";
        
        // Add a button to trigger printing
        echo "<button onclick='window.print()'>Print</button>";
    } else {
        echo "Error: " . $sql . "<br>" . $conn->error;
    }
    
    // Close prepared statement and database connection
    $stmt->close();
    $conn->close();
}
?>

说明：

  1. JavaScript 处理 (index.html):

  • 应用了 

    onsubmit
    事件处理程序来捕获表单提交。

  • 会弹出另一个窗口(

    _blank
    )用于打印。

  • 提交后，会延迟一段时间关闭打印窗口，然后重定向(

    window.location.href
    )回到主页(
    index.html
    )    。

  1. PHP 处理（process.php）：

  • 检查表单是否提交（

    POST
    方法）.

  • 访问表单数据（

    $name
    、
    $email
    ）。

  • 连接到数据库并将数据插入到

    users
    表中。

如果插入成功，则显示打印预览并带有打印按钮。

  • 错误通过适当的错误消息进行处理。

确保您的 MySQL 数据库 (

aaa
) 已正确配置并可使用提供的凭据进行访问 (
$servername
、
$username
、
$password
、
$dbname
)。根据您的设置调整数据库连接详细信息。

此设置应满足输入表单提交、数据库集成、打印预览分辨率和主页重定向的要求。根据您的具体需求和环境按要求完成。根据您的具体要求和环境，根据需要调整 URL 和数据库查询。

祝你有美好的一天<3

最新问题
© www.soinside.com 2019 - 2024. All rights reserved.