Tag Input Like Email Address Editor In JavaScript

Category: Form , Javascript | April 5, 2021
Author: axelavargas
Views Total: 89 views
Official Page: Go to website
Last Update: April 5, 2021
License: MIT

Preview:

Tag Input Like Email Address Editor In JavaScript

Description:

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.

emailsInput.getEmails();

You Might Be Interested In:


Leave a Reply