我想重新运行一个php文件,该文件在html代码中加载到一个div中。在我的主页上,我有一个表格和一个表格。表单向mysql表中添加行,页面上的表输出该mysql表。我希望html页面上的表在通过表单添加新行时更新,而不刷新页面。我尝试将load命令放在表单的ajax函数的success部分,但没有成功。我看了很多其他的答案,没有一个对我有用。
这是我的密码
repaime.php
<h1>Rewards</h1>
<form id="add-reward-form" action="" method="POST">
<label for="inputRewardDescription" class="form-label">Enter Reward Description</label>
<input type="text" id=inputRewardDescription name="description" class="form-control" required>
<label for="inputRewardCost" class="form-label">Enter Reward Cost</label>
<input type="text" id=inputRewardCost name="points" class="form-control" required>
<button type="submit" class="btn btn-success" id="submit-btn">Save</button>
</form>
<p id="message"></p>
<div id="sql-table">
<?php include 'tables.php'; ?>
</div>
tables.php
<?php
$host = "";
$user = "";
$pass = "";
$db_name = "";
//create connection
$connection = mysqli_connect($host, $user, $pass, $db_name);
//test if connection failed
if(mysqli_connect_errno()){
die("connection failed: "
. mysqli_connect_error()
. " (" . mysqli_connect_errno()
. ")");
}
//get results from database
$result = mysqli_query($connection,"SELECT RewardName, PointsRequired FROM rewards");
$all_reward = array(); //declare an array for saving property
while ($reward = mysqli_fetch_field($result)) {
// echo '<th scope="col">' . $reward->name . '</th>'; //get field name for header
array_push($all_reward, $reward->name); //save those to array
}
// echo ' </tr>
// </thead>'; //end tr tag
echo '<table class="table">
<thead>
<tr>
<th scope="col">Reward</th>
<th scope="col">Points Required</th>
<th scope="col">Edit</th>
<th scope="col">Delete</th>
</tr>
</thead>';
//showing all data
while ($row = mysqli_fetch_array($result)) {
echo "<tbody>
<tr>";
foreach ($all_reward as $item) {
echo '<td>' . $row[$item] . '</td>'; //get items using property value
}
echo '<td><i class="fas fa-edit"></i></td>';
echo '<td><i class="fas fa-trash"></i></td>';
echo ' </tr>
</tbody>';
}
echo "</table>";
?>
赎回-form.js
$(document).ready(function() {
$("#add-reward-form").submit(function(e) {
e.preventDefault();
$.ajax( {
url: "add_rewards.php",
method: "POST",
data: $("form").serialize(),
dataType: "text",
success: function(strMessage) {
$("#message").text(strMessage);
$("#add-reward-form")[0].reset();
$("#sql-table").load(" #sql-table > *");
}
});
$("#sql-table").load(" #sql-table > *");
});
});
表单在ajax中工作得非常好,提交到数据库时不需要刷新。但是我也希望在不重新加载的情况下更新页面上的表。
$("#sql-table").load(" #sql-table > *");
这就是我试过的。我把它放在success函数和submit函数中,但两者都不起作用。
2条答案
按热度按时间pn9klfpd1#
你用错了
$.load()
. 这是英语的简写$.ajax()
. 第一个参数必须是url。可选参数为data
及options
.您正在向其传递选择器,因此请求失败。事实上,
$("#sql-table").load(" #sql-table > *");
正在尝试向url发送ajax请求/%20#sql-table%20%3E%20*
. (!)只需更改要执行的php文件的选择器:
voj3qocg2#
强迫怎么样
redeem.php
要在每次输入发生更改时重新评估php div吗?