Tag Input Like Email Address Editor In JavaScript

Category: Form , Javascript | April 5, 2021
Views Total:1,445 views
Official Page:Go to website
Last Update:April 5, 2021


Tag Input Like Email Address Editor In JavaScript


A Vanilla JavaScript-powered email editor that allows you to enter multiple email addresses in one input field just like a tagging system.

More Features:

  • Email validation.
  • Add email addresses programmatically.
  • Auto converts emails into tags by pressing Enter/Comma or when the input field loses focus.

See Also:

How to use it:

1. Import the Email Editor’s JavaScript and Stylesheet into the HTML document.

<link rel="stylesheet" href="/dist/emailsEditor.css" />
<script src="/dist/emailsEditor.bundle.js"></script>

2. Create an empty DIV element for the email input.

<div id="emails-input"></div>

3. Initialize the email editor. That’s it.

const myEmailInput = document.querySelector('#emails-input');
const emailsInput = EmailsInput(inputContainerNode);

4. Add a new email address to the editor.

emailsInput.add('[email protected]');

5. Get the current email addresses.


You Might Be Interested In:

Leave a Reply