如何在 Pug 中删除一段时间后的错误警报

Question

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.

Answer 1

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);

Answer 2

I'm still learning express

Learning Express is a toy store. You're a store?