Validate an email address in JavaScript with a Utility Choreo


Temboo has a growing collection of programming Utilities that will make your life much easier, including an email validation Utility Choreo. In this tutorial we'll show you how to validate an email with JavaScript and a proxy server language. We’ll use PHP as our server-side proxy language for this tutorial, but you can also use Node.js, Ruby, Java, or Python.

To learn more about using non-PHP proxy languages, take a look at the Web Application Server tutorial.

You might ask "why is email validation important?" For forms, it is useful to know if a given email address is valid so that emails can be sent. It must contain the @ character and have a standard top level domain like “.com”, or an IP address like username@123.123.123.12.

The good news is that you don't actually have to worry about the specifics. Our email validation utility will do all the work for you.

Get Set Up

1Log in to Temboo. If you don't already have an account, you can register for free.

2Save a new index.html file, and a new proxy-server.php file into a folder where you'll save the rest of your project files for this tutorial.

3Make sure you've downloaded the Temboo JavaScript SDK, and the Temboo PHP or other server side proxy language SDK of your choice, and that you've added both to your project folder as described in the JavaScript Getting Started tutorial.

Test the Choreo

4Go to the Utilities > Validation > EmailAddress Choreo page. Select JavaScript from the drop down menu at the top of the page.

5Enter an email address that you want to validate. Here’s one you can use:

hey@temboo.com

6Click Generate Code to test the Choreo from our website, and you'll see the the result returned by the Choreo.

Create Your JavaScript Program

7Scroll down to find the Code section of the Choreo page. Copy and paste the snippet into your .html file.

8Scroll down and select PHP from the Proxy Code dropdown menu, then copy and paste the code snippet into your proxy-server.php file.

Add an input form

9In your .html file, find the line where you set the EmailAddress input and remove it or comment it out. This will now be determined by the form we're about to create.

//emailAddressChoreo.setInput('EmailAddress', 'hey@temboo.com');

10Now comment out or delete the .execute method at the end of your script. We'll make it so that the .execute method is called only when our form submit button is clicked.

//emailAddressChoreo.execute(showResult, showError);

11Add the following HTML form with an input field and a submit button after the JavaScript <script></script> tags of your code:

<form id="form">
	<input id="data" />
	<button id="append" type="submit">Submit</button>
</form>

12Add the following code to execute the Choreo when the submit button is clicked. Make sure to place this code after the end of your form:

<script>
// Execute choreo when submit button is clicked
document.getElementById('append').onclick = function() {
    emailAddressChoreo.setInput('EmailAddress', document.getElementById('data').value); 
    emailAddressChoreo.execute(showResult, showError);
}

// Disable submit button when clicked
document.getElementById('form').onsubmit = function(e) {
     e.preventDefault();
    document.getElementById("append").disabled=true;
}
</script>

13Run your PHP server and open your .html page in the browser.

14The results of the email validation will be printed to the console.

What next?

We're all finished! Now check out the rest of Temboo's handy developer Utilities and how to access them via our Javascript SDK. Discover the rest of the 2000+ Choreos in our Library and see how you can combine them with our Utilities to build something amazing.

Once you've got your code up and running, you're ready to move on and do more. From monitoring your running applications, to moving your generated Temboo code to your preferred development environment and sharing it with colleagues, collaborators and friends - we've got you covered.

Need help?

We're always happy to help. Just email us at support@temboo.com, and we'll answer your questions.


Back