Inputmask: Email Address Mask?

Created on 19 Apr 2012  Â·  42Comments  Â·  Source: RobinHerbots/Inputmask

Love the plug-in. Got tired of using of using the Bush plugin that hasn't been updated in forever. Question ... is it possible to make an email mask (with the @ sign)?

Mask Extension

Most helpful comment

Hi ! ( sorry for my English, I'm French)
I'm working on a web app and i'm using this plug-in but i just saw that to put a mask on a input, it must be a type text, in fact the email mask doesn't work on a input with a email type.

Is it normal ? Or is there anyway to go over this ?

Example : https://jsfiddle.net/zyfpca7t/

All 42 comments

Hi Daniel,

creating input restriction for an email is possible. Creating a dynamic mask for email not yet. With dynamic I mean that you see ______@___ and that the part before and after the @ sign is not restricted in length.

Best regards,

Robin

A dynamic email mask would be a very nice addition, +1 from me.

Yeah that would be cool!

Would be awesome! Another +1 :)

+1 from me too :)

+1

Hi all,

About an email mask (alias).

How exactly should an email mask behave? Visible with a template? _____@____.___ or just restrict on input and no visible feedback? Ideas suggestions.

Robin

Hi Robin, I think it should look search for a pattern like this : _@_.com

and should look like this at first: _@_._

So the user know that he has to fill in 3 places and the input should have an "@" sign in the middle.

Shouldn't it be better _@_.___ where the first and middle underscore autoexpand until @ or . is pressed or a space to go the the next part (like in optional masks)

=> $(selector).inputmask("_{1,20}@_{1,20}.*{3}")

Better this one, no?
=> $(selector).inputmask("_{1,20}@_{1,20}._{3}[._{2}]")

Since there are e-mails from country TLDs like '[email protected]'

Yes, .... indeed ;-) , ....

2013/4/8 RaphaelDDL [email protected]

Better this one, no?
=> $(selector).inputmask("_{1,20}@_{1,20}._{3}[._{2}]")

Since there are e-mails from country TLDs like 'something.example.com.br'

—
Reply to this email directly or view it on GitHubhttps://github.com/RobinHerbots/jquery.inputmask/issues/42#issuecomment-16054978
.

Great plugin - replacing Bush plugin for me as well.

+1 for me too!

@MCodeKitty ,

Thx for the compliment and that you like the inputmask plugin :-)

Best regards,

Robin

Great plugin! I tried $(selector).inputmask("_{1,20}@_{1,20}._{3}[._{2}]") for email without success. The mask appeared in the textbox as _{1,20}@_{1,20}._{3}._{2}. Any suggestions? Thank you.

@michaelwatkins ,

That's because this functionality still has to be developed ;-)

+1

+1

+1

after issue #277 I will start on this one

I would suggest to use the following since they are new TLDs coming ;)

$(selector).inputmask("_{1,20}@_{1,20}._{2,6}[._{2}]")

http://icannwiki.com/index.php/.africa

http://icannwiki.com/index.php/.paris

You can use this mask if you are only interested in input restriction.

$(selector).inputmask('Regex', { regex: "[a-zA-Z0-9._%-]+@[a-zA-Z0-9-]+\.[a-zA-Z]{2,4}" });

Hi,

Has support for ______@___ been added to the plugin?

@iamchriswick ,

No not yet.

Nice plugin. Very helpful +

There is a first version of the email alias available in the jquery.inputmask.extensions.js branch 3.x

$(selector).inputmask("email");

Any suggestions for enhancement are welcome.

You should probably start using http://qunitjs.com/ for unit testing.

I already do

How to use dynamic email-or-phone? i need some
email|+7 (999) 999-99-99 mask

Hi,

Has support for [email protected] has been added to the plugin?

Thanks

@Nikhil783 ,

Yes, use the email alias

Just pointing out that it's been 5 years this feature is requested.
And still in need today (I need it).

I understand it's during your free time, but we have been all really patient ;)

@STPJ ,

Try with Inputmask("email").mask(selector)

Thanks it worked.
Is there a way to put this threads as 'Solved' instead of 'Close'

Google brought me here.

@STPJ ,
;-)

I can only set the issue on close.

@RobinHerbots hey, Robin, Very good plugin, thanks for it.
I have this code, but still shows "@" symbol in my input...

```
$(".js-email").inputmask({
regex: "^[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+.[A-Za-z]+$",
placeholder: ""
})
````

@mugukamil ,

Thx.

What is the problem with showing the @? Maybe setting jitMasking option to true is what you want.

@RobinHerbots thanks, its work.

problem was, that even I set placeholder to "", it shows "@"

The following code returns this in the input
Imagem
$('#email_subs').inputmask("email");

Did you include the inputmask.extensions
Je?

When I try to enter incomplete data in the email input, I am notified of a red error in the tag, but the form is not blocked at the time of submission. I mean the submission button.

<form>
   <div class="form-group">
            <label> Email</label>
            <input id="target" class="form-control" type="text" required="" />
  </div>
  <button type="submit">Save</button>
</form>

javascripts:
import Inputmask from "inputmask";
new Inputmask({ alias: "email" }).mask($("#target"));

Why? am I wrong?

Hi ! ( sorry for my English, I'm French)
I'm working on a web app and i'm using this plug-in but i just saw that to put a mask on a input, it must be a type text, in fact the email mask doesn't work on a input with a email type.

Is it normal ? Or is there anyway to go over this ?

Example : https://jsfiddle.net/zyfpca7t/

Was this page helpful?
0 / 5 - 0 ratings