Tuesday, November 25, 2014

Automated Email Form Part 2

Continuing our post from Automated Email Form Part 1.

Now you have a trigger setup in Zapier, lets setup the webpage to send an email to yourself.

This will be an AngularJS app, so add the appropriate pieces to make it work. (you can look at angularjs.org or many online tutorials for specifics).

First lets add an input field to your webpage like so:

If you notice I left name in there, but i'm not collecting names, I decided the less a user has to type the lower the barrier to contacting me in this case. Maybe one day I'll add a name if I feel its necessary, but just adding one more field with the NG model set to name would capture the users name for yourself.

Basically I setup an NG-Click to call a function in my angularjs code.

So while in some cases you could put your angularjs code in html, most of the time you put it in a .js file, (I'm putting in the .html so there are script tags surrounding, but generally don't do that, unless it's a REALLY simple app, which in this case it is).

If you notice I do a simple regex email validate check.

When it passes it pushes the email address to my firebase link, next Zapier picks up the change and sends you an email.

Pro Tip: In fact I almost forgot I had it setup and when I received an email with the submitted email, I got really confused. so DON'T forget to make the subject easily recognizable, otherwise you might run into the same case :)

Good luck and let me know how it works for you!