Tutorial | Send a Triggered Email to Members

In this tutorial, you'll learn how to automatically send a personalized email to the currently logged-in site member using Triggered Emails and an input form. You'll use a form submission as the trigger, but you can adapt this approach to send emails from anywhere in your code.

You'll build a simple form where site members can enter their name, select their favorite sport, and add comments. When the form is submitted, your site will send a personalized Triggered Email to the logged-in member with the information they provided.

We'll use the following steps to send a triggered email to a member:

1. Set up your Triggered Email template.
2. Create a form for member input.
3. Send the email on form submission.

Before you begin

It's important to note the following before starting this tutorial:

• Members must be able to login to your site.
• Triggered Emails may not work properly in preview mode. Publish your site to test the code.
• Make sure to have a collection, such as sportsEmail, that you can connect to a dataset later.

Step 1 | Set up your Triggered Email template

In this step, you'll create a Triggered Email template with variables for personalization.

To set up your Triggered Email:

1. Go to Developer Tools on your site's dashboard and select Triggered Emails.
2. Add sender details, including the sender's name and email address.
3. Create a new Triggered Email and add variables such as name, sport, and comments.
4. Give your email template a meaningful name, such as sportMail.
5. Publish the Triggered Email.
6. Copy the code snippet for emailing site members. You'll use this code in a later step.

The code should look like this:

Step 2 | Create a form for member input

In this step, you'll build a simple form that collects input from the site member. The form includes input fields for each variable you set up in your Triggered Email, as well as a submit button. All elements should be connected to the same dataset.

To create the form:

1. Add input elements for each variable that you set up in your Triggered Email, such as name, sport, comments. In our example, we add:
   • An input element for entering a name. Set the input ID to nameInput.
   • A dropdown for selecting a sport. Set the dropdown ID to sportDropdown.
   • A text box for entering comments. Set the text box ID to commentsInput.
   • A button for submitting the data. Set the button ID to submitButton.
   • A dataset for connecting elements. Set the dataset ID to sportDataset.
2. Add a submit button.
3. Create a dataset called sportDataset that's connected to the sportsEmail collection you created earlier.
4. Connect each input element to the same dataset, such as sportDataset.
5. Connect the button to the same dataset and set it to the Submit action.

Step 3 | Add frontend code

In this step, you'll add code that sends the Triggered Email to the site member when the form is submitted.

1. Import the required modules at the top of your page code:

2. Register an onAnAfterSave() event handler for your dataset to run the code each time the form is successfully submitted.

3. Get the values from the input elements.

4. Get the currently logged in member userId.

5. Paste the Triggered Email code snippet from earlier.

Replace the placeholders in the code snippet with the values you saved from the form, and the member ID, to personalize the email.

Full example

The following example includes error handling for both successful and failed email attempts.

See also

• Triggered Emails
• Create a Triggered Email