Small Vanilla Javascript Tag Input Emails-Editor Library

emails-editor Vanilla JavaScript allows you to enter multiple email addresses in one input field just like the tagging system.

The library allows the collection of emails and deletes them using an input editor.

  • An email will be added to the editor when the user:
    • Press enter
    • Click on the comma
    • The input loses focus
  • Supports pasting emails separated by commas
  • Each email entry is validated, if the email is wrong it will be marked as invalid and the corresponding CSS class will be added
  • The library does not have external dependencies on the production
  • The library offers a general API for adding email and getting current emails

simple email validation in javascript, input typetel, javascript email validation, html5 email validation pattern, input typeurl, html input types

How to make use of it:

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

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

2. Create an empty DIV factor for the e-mail input.

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

3. Initialize the e-mail editor.

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

4. Add a brand new e-mail handle to the editor.

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

5. Get the present e-mail addresses.

emailsInput.getEmails();

Tag Input Like Email Address Editor, emails-editor Plugin/Github

emails-editor


See Demo And Download

Official Website(axelavargas): Click Here

This superior jQuery/javascript plugin is developed by axelavargas. For extra Advanced Usage, please go to the official website.

Share