Submission notification

Ask the community
,
1

How do i connect the user input to send a notification mail when submission in entering to the system?

3 Likes
2

Hi Mia,

At the moment, we do not have an automatic feature to send an email on form submission. One is planned.

However, we do have the ability to code such behavior using dataset events and backend code. What you should be looking at are

  1. use the dataset afterSave event as your trigger.
  2. write a web module that is called whenever the afterSave event is triggered
  3. In the backend code, connect to an email provider such as MailChimp or SendGrid to send an email.

The actual code will look something like this

  1. In the page code
import {send} from 'backend/sendEmail';

export function dataset_afterSave(event) {
    send($w("#toEmail").value,
	 $w("#subject").value,
	 $w("#fromEmail").value,
	 $w("#emailContent").value)
	.then((res) => {
	    console.log(res);
	})
	.catch((error) => {
	    console.log(error);
	})
}
  1. the web module - the backend/sendEmail.jsw
    Note you need to set your SendGrid API key in this file
import {sendEmail} from './sendGrid';
export function send(toEmail, subject, fromEmail, content) {
    // normally, you will declare here your apiKey instead of getting it from the client
    var apiKey = YOUR_API_KEY;
    return sendEmail(apiKey,toEmail, subject, fromEmail, content);
}
  1. Calling the SendGrid API backend/sendGrid.js
import fetch from 'wix-fetch';
export function sendEmail(apiKey,toEmail, subject, fromEmail, content) {
    var headers = {
	"Authorization": "Bearer " + apiKey,
	"Content-Type": "application/json"
    };
    var body = {
	"personalizations": [
	    {
		"to": [ 
		    {
			"email": toEmail
		    }
		], 
		"subject": subject 
	    }
	], 
	"from": {
	    "email": fromEmail
	}, 
	"content": [
	    { "type":"text/plain", "value": content}
	]
    };
    return fetch('https://api.sendgrid.com/v3/mail/send', {
	method: 'POST',
        headers: headers,
        body: JSON.stringify(body)
   })
    .then((res) => {
	if (res.status === 202)
	    return 'Email was sent';
	else {
	    var headersString = '';
		res.headers.forEach((value, name) => headersString += `${name}: ${value}\n`);
		return res.text()
	    	    .then((bodyText) => {
		    return Promise.reject(new Error('Failed to send email.\n' + 
			`Status: ${res.status}\n` + 
			headersString + 
			bodyText));
		})
	}
    });
}
3

Thanks Yoav
I’ll try to make it work - but please if you could hurry up this feature!

4

Hi Yoav - I am new at the code stuff and leaning fast - however is there any chance you could
arrange the code you wrote on top according to my details? (the e-mail needs to send to and database file name - i have no idea what’s the API key) I am making a lot of mistypes and short in help - if you could write it for me once so I could learn from that or could you direct me to someone that could help me.
Thanks at advance

5

We’ve just added a new article on this subject:

https://support.wix.com/en/article/sending-an-email-on-form-submission

6

So confusing. The notification email should be simple like those old simple Wix forms. A lot of coding for something that should be really simple. Couldn’t even start process. Code beginners need more detailed articles (video tutorials would be fine!).

7

Hey, this is a forum for WIX Code. We try to teach and learn using WIX Code. If coding is not an option and sometimes it isn’t, then use App Market and maybe the 1-2-3 Form Builder?

8

Does wix have recommended developers we can hire to do this?

9

Hi All!

I just found a MUCH easier way to have a notification sent to your email when a custom form is submitted (this way does NOT require ANY code or use of Velo!).
There is a super helpful Velo tutorial out there that does this, but they require a 3rd party service and some coding knowledge. I found a built in way that Wix will complete this for you so you don’t have to connect a 3rd party (like SendGrid) OR write a SINGLE line of code.

Here’s how to receive a notification from custom forms WITHOUT any code:

  1. After building your form, go to your site’s dashboard

  2. Select “Customer Management” from the menu on the left

  3. Select “Automations” from the menu on the left

  4. Select “New Automation” from the list

  5. For the trigger, select “Wix Data Forms”

  6. For the option “Select which form triggers the automation” you can set that to be any form, or specific forms (just choose whichever you prefer)

  7. For the follow-up action, select the mode which you want to receive a notification (email, web, mobile)

  8. Customize the notification email, subject, and message

  9. Set the timing of the trigger

  10. And that’s it!! If you opt to have an email notification (which is what I did), that email will have the entire form that was submitted so you don’t even need to go to your Wix Dashboard to view the submission if you don’t want to.

Hope this helps!!