Question

我有一个多页面Web应用程序，需要更改为单页面Web应用程序。

我创建输入的表单有效，但是当您单击提交时，它总是会将用户带到空白页面。

我能做些什么，以便它会留在这个页面上，只是弹出警告信息吗？

HTML代码

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
h1{
    text-align: center;
}
</style>
<title> CRUD</title>
</head>
<body>
<h1> CRUD Management</h1>

<!--Create Row-->
<h2> Create new Entry </h2>
<form>
    <p>
        <label for="ID">ID:</label>
        <input type="text" name="id" id="id">
    </p>
    <p>
        <label for="creator">Creator:</label>
        <input type="text" name="creator" id="creator">
    </p>
    <p>
        <label for="title">Title:</label>
        <input type="text" name="title" id="title">
    </p>
     <p>
        <label for="type">Type:</label>
        <input type="text" name="type" id="type">
    </p>
    <p>
        <label for="identifier">Identifier:</label>
        <input type="text" name="identifier" id="identifier">
    </p>
    <p>
        <label for="date">Date:</label>
        <input type="date" name="date" id="date">
    </p>
    <p>
        <label for="language">Language:</label>
        <input type="text" name="language" id="language">
    </p>
    <p>
        <label for="description">Description:</label>
        <input type="text" name="description" id="description">
    </p>
    <input type="submit" value="Submit" action="insert.php" method="post">
</form>
<table>
<h2>Retrieve Data</h2>
        <thead>
            <tr>
                <th>ID</td>
                <th>Creator</td>
                <th>Title</td>
                <th>Type</td>
                <th>Date</td>
                <th>Identifier</td>
                <th>Language</td>
                <th>Description</td>
            </tr>
        </thead>
        <tbody>
                        <tr>
                    <td><?php echo $row['id']?></td>
                    <td><?php echo $row['creator']?></td>
                    <td><?php echo $row['title']?></td>
                    <td><?php echo $row['type']?></td>
                    <td><?php echo $row['date']?></td>
                    <td><?php echo $row['identifier']?></td>
                    <td><?php echo $row['language']?></td>
                    <td><?php echo $row['description']?></td>
                </tr>

        </tbody>
            </table>
    </body>
</html>



<a href="/a3/createForm.html" target="_parent"><button>Create</button></a>

<a href="/a3/retrieve.php" target="_parent"><button>Retrieve</button></a>

<a href="/a3/updateForm.html" target="_parent"><button>Update</button></a>

<a href="/a3/deleteForm.html" target="_parent"><button>Delete</button></a>
</body>
</html>

PHP文件

<?php
$servername = "localhost";
$username = "root";
$password = "password";
$dbname = "some-database";
// Create connection
$link = mysqli_connect($servername, $username, $password, $dbname);
// Check connection
if ($link === false) {
    die("Connection failed: " . mysqli_connect_error());
} 
$ID = mysqli_real_escape_string($link, $_REQUEST['id']);
$creator = mysqli_real_escape_string($link, $_REQUEST['creator']);
$type = mysqli_real_escape_string($link, $_REQUEST['type']);
$title = mysqli_real_escape_string($link, $_REQUEST['title']);
$identifier = mysqli_real_escape_string($link, $_REQUEST['identifier']);
$date = mysqli_real_escape_string($link, $_REQUEST['date']);
$language = mysqli_real_escape_string($link, $_REQUEST['language']);
$description = mysqli_real_escape_string($link, $_REQUEST['description']);

$sql = "INSERT INTO ebook_metadata (id, creator, title, type, identifier, date, language, description)
VALUES ('$ID', '$creator', '$title', '$type', '$identifier', '$date', '$language','$description')";

/* if(mysqli_query($link, $sql)){
    echo "Records added successfully.";
} else{
    echo "ERROR: Could not able to execute $sql. " . mysqli_error($link);
} */

mysqli_close($link);
?>

Answer 1

首先学习如何在HTML中使用表单，然后回到这里看看你所描述的问题的解决方案：

为了防止<form>转到新网页或重新加载，最简单的解决方案是在return false;侦听器中使用onsubmit并通过JavaScript处理您的提交：< / p>

<form onsubmit="handleSubmit(this); return false;">

单页申请表

1 个答案: