使用AJAX动态更新数据库中的文本 [英] Using AJAX to dynamically update text from a database
问题描述
我一直在努力学习AJAX，以便我可以动态地使用数据库中的新文本来更新网页，因为似乎所有的Ajax教程都是涉及将数据写入数据库的更复杂的示例
I've been really struggling trying to learn AJAX so that I can simply update my webpages with new text from the database dynamically because it seems like all the ajax tutorials are more complex examples that involve writing data to the database
我正在处理的页面只是一个PHP脚本，需要向其发布注册和ID号，然后该页面显示数据库中的消息(经常更新).我目前在页面顶部有一个更新消息"按钮，该按钮发送命令以更新消息，但是它需要刷新页面才能工作.
The page im working on is simply a PHP script that requires a registration and id number to be posted to it, and it turn displays messages (which are frequently updated) from the database. I currently have an "Update Messages" button at the top of my page which sends the command to update messages, but it requires a page refresh to work.
我只想使用ajax来动态刷新消息.这是我到目前为止所写的内容，基于我在>中找到的内容使用Jquery Ajax从Mysql检索数据，但是它不起作用，因为我不知道如何使用ajax将注册和id号作为参数传递给php脚本并显示响应.
I would simply like to use ajax to refresh the messages dynamically. Here is what i've written so far, based on what I found at Using Jquery Ajax to retrieve data from Mysql , but it isn't functional since I don't know how to pass in the registration and id number as parameters to the php script using ajax and display the response.
请注意，sendPushNotification功能是不相关的并且可以正常工作(用于发送命令以更新消息).
Note that the sendPushNotificationfunction is unrelated and works properly(used to send the command to update messages).
readmessages.php
readmessages.php
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Inbox</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
});
function sendPushNotification(id){
var data = $('form#'+id).serialize();
$('form#'+id).unbind('submit');
$.ajax({
url: "send_message.php",
type: 'GET',
data: data,
beforeSend: function() {
},
success: function(data, textStatus, xhr) {
$('.txt_message').val("");
},
error: function(xhr, textStatus, errorThrown) {
}
});
return false;
}
function updateText(registration, rowid) {
$.ajax({ //create an ajax request to readmessages.php
type: "GET",
url: "readmessages.php",
dataType: "html", //expect html to be returned
success: function(response){
$("#responsecontainer").html(response);
}
});
}
</script>
</head>
<body>
<?php
// receive data from HTML readmessages request
$rName=$_POST["registration"]; //POST information required to read information from the database
$rowId=$_POST["rowid"];
require_once 'access.php';
if (!userIsLoggedIn()) {
include 'login.php';
exit();
}
include_once './db_functions.php';
$db = new DB_Functions();
?>
<form id="<?php echo $rowId ?>" name="" method="post" onsubmit="return sendPushNotification('<?php echo $rowId ?>')">
<input type="hidden" name="message" value="readmessages" />
<input type="hidden" name="regId" value="<?php echo $rName ?>"/>
<input type="submit" class="send_btn" value="Update Messages" onclick="return updateText(<?php echo $rName ?>, <?php echo $rowId ?>);"/> //Attempts to call function to update text once button is pressed (not functioning)
<?php
$messagelist = $db->getInbox($rName); //calls the database to retrieve messages
echo nl2br($messagelist); //Displays message list that I want to update
include './logout.php';
?>
</body>
</html>
任何帮助将不胜感激！
:更新了包含正确引号的行:
Updated line to contain proper quotes:
<input type="submit" class="send_btn" value="Update Messages" onclick="return updateText('<?php echo $rName ?>', '<?php echo $rowId ?>')"/>
推荐答案
您需要将数据与ajax请求一起包括在内，
You need to include the data along with the ajax request,
data: {registration: registration, rowid: rowid},
，并将类型设置为POST，因为从php端检索POST变量.
and also set the type to POST since on the php side youre retrieving the POST variables.
就这样......
function updateText(registration, rowid) {
$.ajax({ //create an ajax request to readmessages.php
type: "POST",
url: "readmessages.php",
dataType: "html", //expect html to be returned
data: {registration: registration, rowid: rowid},
success: function(response){
$("#responsecontainer").html(response);
}
这篇关于使用AJAX动态更新数据库中的文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
