guys. I'm still learning express, and I am using Pug to view my elements in the browser. I'm showing an error alert when a client tries to send a testimonial before to fill all information. The problem is those alerts stay on the screen and don't disappear. I would like to make them disappear after a few seconds.
This is the code I'm using to send the errors to testimoniales.pug file.
const errores = [];
if(name.trim() === ''){
errores.push({message : 'The name is empty'});
}
if(mail.trim() === ''){
errores.push({message : 'The mail is empty'});
}
if(message.trim() === ''){
errores.push({message : 'The message is empty'});
}
* if(errores.length > 0){
//consult the testimonials that already exis
const testimoniales = await Testimonial.findAll();
//show the view with errors
res.render('testimoniales', {
page: 'Testimoniales',
errores,
name,
main,
message,
testimoniales
});*
}else{
//Save in the DATABASE
try {
await Testimonial.create({
name,
mail,
message
});
res.redirect('/testimoniales');
} catch (error) {
console.log(error);
}
}
This is the code to show the errors in my testimoniales.pug file.
if(errores)
each error in errores
.alert.col.alert-danger.text-center= error.mensaje
So, all I want is to eliminate the alerts after 3 or 5 seconds.
CodePudding user response:
You would need some client-side Javascript.
Something like:
if (errores)
#errors
each error in errores
.alert.col.alert-danger.text-center=error.mensaje
And add, maybe after </body>
,:
if (errores)
script.
setTimeout(()=>
document.getElementById("errors").style.display="none", 5000);