Bootstrap Token Field inputType email is not working

Question

I am using bootstrap and Token Field plugin to get multiple emails. I have mentioned like this.

<input type="email" id="token-friend-email" class="friend-email form-control input-border input-style" value="" placeholder="" required>

and

$('#token-friend-email').tokenfield({
    inputType : 'email',
    delimiter:';'

});

But the token field is accepting all types of input. I want only email type to be accepted. Help me to fix this.

Answer 1

DEMO check this demo

Html part

<input type="text" class="form-control" id="tokenfield" value="" />

This is the jquery part...

$('#tokenfield')

  .on('tokenfield:createtoken', function (e) {
    var data = e.attrs.value.split('|')
    e.attrs.value = data[1] || data[0]
    e.attrs.label = data[1] ? data[0] + ' (' + data[1] + ')' : data[0]
  })

  .on('tokenfield:createdtoken', function (e) {
    // Über-simplistic e-mail validation
    var re = /\S+@\S+\.\S+/
    var valid = re.test(e.attrs.value)
    if (!valid) {
      $(e.relatedTarget).addClass('invalid')
    }
  })

  .on('tokenfield:edittoken', function (e) {
    if (e.attrs.label !== e.attrs.value) {
      var label = e.attrs.label.split(' (')
      e.attrs.value = label[0] + '|' + e.attrs.value
    }
  })

  .on('tokenfield:removedtoken', function (e) {
    alert('Token removed! Token value was: ' + e.attrs.value)
  })

  .tokenfield()