Skip to content

logoblog

How to send an automated email to users who answer a Javascript form

Javascript, JS, Forms, Automated emails2 min read

Hi no-code community :)

Today we'll show you how you can use Palabra to send an automated email every time a user answers a Javascript form.

You can use this workflow when you need to automate an email after a users signs up, when a user cancels a subscription, or subscribes to a newsletter. Follow the steps on this guide to handle all your email marketing strategies from your Javascript app on Palabra.

The first step is to go to your Palabra dashboard and click on 'Create new action':

Create new action

This will display the template gallery where you can pick a template for your emails. Pick the template that works best for your use case. On this example we'll use a template to send a welcome email to new sign ups. There are many other templates to pick from, make sure you take a look!

Templates

This template includes a pre-written email you can use, but you can customize it as you like.

The next step is to connect our Javascript form. To do that we'll click the "Connect your form here" button:

Connect your form

And since we want to connect a Javascript form that's what we'll choose:

Javascript

The next step is to go ahead and copy the URL provided to you. We'll need it later to connect Palabra to your form.

Javascript URL

The next step is to go to your website. If you don't have a form already here's a simple one you can use:

1<body>
2 <h1>Your form</h1>
3 <input type="text" name="email" id="email" />
4 <button id="button">Sign up</button>
5</body>
6<script src="scripts.js"></script>

The next step is to go to our JS file to handle what happens when the use clicks on the "Sign up" button. On the our JS file we'll paste the following:

1const $input = document.querySelector("#email");
2const $button = document.querySelector("#button");
3
4$button.addEventListener("click", async () => {
5 const email = $input.value;
6
7 await fetch("[YOUR-PALABRA-URL]", {
8 method: "POST",
9 headers: {
10 "Content-Type": "application/x-www-form-urlencoded"
11 },
12 body: `email=${email}`
13 });
14});

You'll need to replace [YOUR-PALABRA-URL] with the URL you copied from Palabra (it will look something like: https://hooks.palabra.io/js/[SOMETHING]).

And that's it! The final step is to go back to Palabra to activate your workflow. Once that is done every person who completes your sign up form will receive the automated email we defined.

Card

If you want to edit the content of the email we can do that at any point by clicking on the card that's called "Send welcome email".

Email content

If you want to stop this automatic email you can pause these actions at any time by clicking the "Pause actions" button on the top right.

You'll be able to see how many people received these emails from this same page on the "Results" column.


Hope you enjoyed this tutorial! If you are curious about what else you can do with Palabra or would just like to try it go ahead an create an account here.

© 2020 by Palabra. All rights reserved.