En mi web, los mensajes personales sin leer aparecen en color rojo y los leídos, en azul.
He creado un script jQuery para que al hacer clic en un mensaje no leído, pase a leído en la BD (de 0 a 1) y cambie de color mediante un cambio en las clases CSS:
$(function()
{
$('.mensaje-no-leido').click(function()
{
var idMensaje = $(this).data('id-mensaje');
$.ajax(
{
type: 'POST', url: '../ajax_marcar_leidos.php', data: {id_mensaje: idMensaje},
success: function(respuesta)
{
if(respuesta == 1) $(this).removeClass('mensaje-no-leido').addClass('mensaje-leido');
else swal('Vaya...', 'Sabemos que lo querías marcar como leído, pero algo ha fallado...', 'error', {button: false});
},
error: function()
{
swal('Vaya...', 'Sabemos que lo querías marcar como leído, pero algo ha fallado...', 'error', {button: false});
}
})
});
});
Sin embargo, $(this).removeClass('mensaje-no-leido').addClass('mensaje-leido');
sólo funciona fuera de la llamada AJaX, pero no quiero que se cambie el color simplemente con hacer clic, sino tras recibir la confirmación desde la BD de que se ha ejecutado el UPDATE
.
¿Cómo podría hacerlo?
const elemClicked = $(this);
, y luego simplemente accede aelemClicked
– Benito-B el 23 dic. 20 a las 17:14