Usando AJAX para actualizar dinámicamente el texto de una base de datos
Me ha costado mucho tratar de aprender AJAX para poder actualizar mis páginas web con texto nuevo de la base de datos dinámicamente porque parece que todos los tutoriales de ajax son ejemplos más complejos que implican escribir datos en la base de datos.
La página en la que estoy trabajando es simplemente un script PHP que requiere que se registre un número de identificación y registro, y a su vez muestra mensajes (que se actualizan con frecuencia) de la base de datos. Actualmente tengo un botón "Actualizar mensajes" en la parte superior de mi página que envía el comando para actualizar los mensajes, pero requiere una actualización de la página para funcionar.
Simplemente me gustaría usar ajax para actualizar los mensajes dinámicamente. Esto es lo que he escrito hasta ahora, basado en lo que encontré enUsando Jquery Ajax para recuperar datos de Mysql , pero no es funcional ya que no sé cómo pasar el número de registro e identificación como parámetros al script php usando ajax y mostrar la respuesta.
Tenga en cuenta que elsendPushNotificationLa función no está relacionada y funciona correctamente (se utiliza para enviar el comando para actualizar mensajes).
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>
Cualquier ayuda sería muy apreciada!
EDITAR: Línea actualizada para contener citas apropiadas:
<input type="submit" class="send_btn" value="Update Messages" onclick="return updateText('<?php echo $rName ?>', '<?php echo $rowId ?>')"/>