how to add success message in http post response after button submitted

Question

i am using nodemailer and express...

i want to add text message and loading in front-end when form is inprogress to submit or not.

.ts

  sendMail(value) {    
    console.log('email sent');    
    // this.form.reset();
    const data = {
        to: 'xxxx@gmail.com',
        subject: this.name,
        txt:  'Email:' + this.email + 
              'Name:' + this.name + 
              'Message:' + this.message
    };
    return this.http.post('http://localhost:3000/api/mail/contact', data).subscribe(      
      data => console.log(data)      
    );
  }

Hi there, I think if I understand correctly you want to show a progress bar while processing right ? If so I suggest you look at this : https://material.angular.io/components/progress-bar/overview Hope it will help. Thanks, Jeremy — jérémy Darchy, Jun 10 '18 at 08:58

לבני מלכה · Answer 1 · 2018-06-10T08:59:07.750

0

Try this:

 sendMail(value) {    
    console.log('email sent');    
    // this.form.reset();
    const data = {
        to: 'xxxx@gmail.com',
        subject: this.name,
        txt:  'Email:' + this.email + 
              'Name:' + this.name + 
              'Message:' + this.message
    };
    return this.http.post('http://localhost:3000/api/mail/contact', data).subscribe(      
      data => {alert(data)},Error => {alert("failed data")}    
    );
  }

You can also use bootstrap 4 alert(or something else): https://www.w3schools.com/bootstrap4/bootstrap_alerts.asp

edited Jun 10 '18 at 08:59

answered Jun 10 '18 at 08:48

לבני מלכה

14,372
2
15
38

it failed the data and it double send the email http://prntscr.com/jt89wv – Richard Frey Reyes Jun 10 '18 at 11:00
or maybe something failed after sending mail – לבני מלכה Jun 10 '18 at 11:03
It return Error with status succsess can you show me your server code (what you return) – לבני מלכה Jun 10 '18 at 11:13
read it:https://stackoverflow.com/questions/27921537/returning-http-200-ok-with-error-within-response-body – לבני מלכה Jun 10 '18 at 11:15
here is my server code prntscr.com/jth0py i don't know why i have an error.. but the email was sucessfuly sent – Richard Frey Reyes Jun 11 '18 at 03:16
please read it:https://stackoverflow.com/questions/6186770/ajax-request-returns-200-ok-but-an-error-event-is-fired-instead-of-success – לבני מלכה Jun 11 '18 at 05:10
thanks alot.. this solves the problem ~> return this.http.post('http://localhost:3000/api/mail/contact', data, { headers: new HttpHeaders().set('Content-Type', 'application/json'), responseType: 'text' }).subscribe( data => {console.log('data')}, error => {console.log("failed data")} ); – Richard Frey Reyes Jun 11 '18 at 05:45
thumbs up dude! – Richard Frey Reyes Jun 11 '18 at 05:46
I am woman...;) and really appricate if you up vote and markas answer – לבני מלכה Jun 11 '18 at 05:47
https://meta.stackexchange.com/questions/147531/how-mark-my-question-as-answered-on-stackoverflow – לבני מלכה Jun 11 '18 at 08:59

how to add success message in http post response after button submitted

1 Answers1