yongzhenlow / email-autocomplete Goto Github PK

Nice plugin
Minor issue though, if you use jquery validation, the validation pluing does not use the new value of the auto completed email address.
eg I enter fred@g - this autocompletes to [email protected], but jquery validation says fred@g is not a valid email.

Easy fix is to include a call to revalidate the field on the autocomplete

autocomplete: function () {
  if(typeof this.suggestion === "undefined"){
    return false;
  }
  this.$field.val(this.val + this.suggestion);
  this.$suggOverlay.html("");
  this.$cval.html("");
  this.$field.valid();
}

Great plugin, but I when I used it with a bootstrap dialog that was initially hidden (and shown via Javascript), the fieldLeftOffset that was calculated on init was zero (as the field was not visible).

I guess I could call init when I show my dialog, but I wanted the email autocomplete automatically on any email fields, set in the doc ready

$(document).ready(function () {
$("input[type=email]").emailautocomplete();
};

I don't want to have to check when a dialog is shown and call above again.

One workaround is to recalculate the fieldLeftOffset if its zero in the displaySuggestion function:

displaySuggestion: function (e) {
...
if (this.$field.outerWidth() > cvalWidth) {
//for fields that are initial hidden the fieldLeftOffset will not have been calculated correctly
if (this.fieldLeftOffset == 0) {
//get input padding,border and margin to offset text
this.fieldLeftOffset = (this.$field.outerWidth(true) - this.$field.width()) / 2;
}

    //offset our suggestion container
    this.$suggOverlay.css('left', this.fieldLeftOffset + cvalWidth + "px");
  }
},

...
}

Hi Yong, my name is Denis, from Brazil, and i'd like to add at the script some important domains that can improve the form complete with the most used domain from the world., AND i'd like to know why the first caso don't work. I need to add a blank information at first array to work fine! They are:

'','gmail.com','hotmail.com','hotmail.com.br','outlook.com','outlook.com.br','yahoo.com','yahoo.com.br','aol.com','bol.com.br','brazilmail.com.br','brfree.com.br','brturbo.com.br','colombo.com.br','dglnet.com.br','facebook.com','globalsite.com.br','globo.com','globomail.com','gmx.at','gmx.ch','gmx.com','gmx.net','ibest.com.br','icloud.com','ig.com.br','itelefonica.com.br','keemail.me','live.com','mac.com','mail.com','mail.ru','mailbr.com.br','me.com','msn.com','oi.com.br','osite.com.br','pop.com.br','posteo.com.br','protonmail.ch','protonmail.com','superig.com.br','terra.com.br','tuta.io','tutamail.com','tutanota.com','tutanota.de','ubbi.com.br','uol.com.br','veloxmail.com.br','windowslive.com','yahoo.co.uk','yahoo.es','yahoo.fr','yahoo.it','yandex.com','yandex.mail','ymail.com','zipmail.com.br','zoho.com','zohomail.com'

Thanks a lot for the script.

Denis Iongbloed

Can I add some domains to default domains list and send PR?
Or you want to keep default domains simple?

Thanks for reply
Vojta

Hi guy,

First I want to say thanks for your plugin.
Next, I have apply your plugin to my example and found an issue.
Please look it http://pix.toile-libre.org/upload/original/1474452273.png
I hope you will fix it soon.

Thanks!

Come on, who actually has an google email address? ;)

If it is actually included, is there a way to prioritize gmail.com so it appears first? Right now, when a use types g, google.com appears first, not gmail.com. Seems like you could just reorder the list, probably.

I'm aware you could use a custom list, but the default list is very helpful.

Newest version (not in demo) matches a dot to any character. Pressing enter afterwards leaves the dot in. So "@gma.l" matches "gmail.com". Pressing enter when @gma.l in in the input completes the field to @gma.l.com.

Probably a problem with this line: https://github.com/10w042/email-autocomplete/blob/master/src/jquery.email-autocomplete.js#L90

When using this with a floated text field the alignment of the overlay is off to the left.

For example if @gmail.com is an autocomplete suggestion when the user types "myname@gm"
The user sees the additional "ail.com" in grey next to it and thinks they can click in the next field to accept this. The field value then appears potentially complete when it is not (OK the last bit is in grey but the user still thinks all is well.)

How can we make it so the suggestion is automatically accepted when they click into the next field? (As if the user had pressed tab or right arrow to accept.)
Alternatively how can we make the suggested portion disappear if the user clicks out of the field prematurely?

Many thanks

I don't think this is desired behavior.

Hi, thanks for making this. Do you have any interest in removing the requirement for jQuery?

When a suggestion is present allow the user to press the right arrow key to confirm. This matches Google's search field.

We have users who think there are capital letters in their email addresses. So they may type MyName@G.. expecting Gmail.com to be suggested but it wouldn't. I did have a function to force lowercase entry into the field however this might be confusing for the user who thinks they are being prevented from typing their email address as it should be.

My own solution was to use toLowerCase() on lines 89 and 92:

      var match = this._domains.filter(function (domain) {
        return 0 === domain.indexOf(str.toLowerCase()); //use lowercase for case insensitive search
      }).shift() || "";

      return match.replace(str.toLowerCase(), "");      //also force lowercase matching here to ensure typed text is not prepended to the autocomplete suggestion
                                                        //(example; @GOOgooglemail.com)

There may be a better way of doing it? Although I like that this way preserves the casing that the user wants.