Regex: Allow multiple emails separated by ; (semicolon) AND allow blank/empty value - javascript

Here is my regex:
var emailsRegex = /^[\W]*([\w+\-.%]+#[\w\-.]+\.[A-Za-z]{2,4}[\W]*;{1}[\W]*)*([\w+\-.%]+#[\w\-.]+\.[A-Za-z]{2,4})[\W]*$/;
Currently it allows fully qualified single emails and multiple emails separated by semicolon, example:
email1#hi.com
email1#hi.com; email2#hi.com
email1#hi.com; email2#hi.com; email3#hi.com
...are all valid.
I want this to stay the same, but also allow blank/empty inputs. My form is flagging $invalid with a blank input field, even though the required attribute is not specified on the input field.
I suspect this is because it is not passing the regex validation. Thanks!

Please do not use a regex to match an email. First of all your regex is wrong (it won't match emails like foo+bar#example.org which is perfectly valid given RFC822 and newer RFCs). You should better use a library like verifyjs or fogcreek's email checker to check that email.
Then all you have to do is to split your string around each emails using email_string.split(';') and apply the checker on each of them.
HTH

I ended up using string.split(;) and then passing through an improved RegEx which should account for 99% of email addresses in use today. And I'm doing it inside an Angular Directive.
It allows for empty inputs, multiple emails separated by ; which comply with the RFC for majority usage of email addresses.
HTML
<input type="text" id="emailCc" name="emailCc" ng-model="vm.ccRecipient" class="form-control input-sm" multiple-emails="vm.ccRecipient" placeholder="Email Cc" />
AngularJS
angular.module('my-app')
.directive('multipleEmails', function () {
return {
require: 'ngModel',
link: function (scope, element, attrs, ctrl) {
ctrl.$parsers.unshift(function (rawInput) {
var emails = rawInput.split(';');
//console.log(emails);
// Consider not using complex regex validation for emails. See: https://davidcel.is/posts/stop-validating-email-addresses-with-regex/
// Instead, consider just checking for an "#" and a "." and call it a done. The mail daemon will return whether its a valid or invalid/bounced email address
//var emailsRegex = /.+#.+\..+/i;
// define single email validator here
var regexPattern = /^(([^<>()\[\]\\.,;:\s#"]+(\.[^<>()\[\]\\.,;:\s#"]+)*)|(".+"))#((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
// angular.foreach(emails, function() {
var validityArr = emails.map(function (str) {
if (rawInput) {
return regexPattern.test(str.trim());
} else if (!rawInput) {
return true;
}
}); // sample return is [true, true, true, false, false, false]
//console.log(emails, validityArr);
var atLeastOneInvalid = false;
angular.forEach(validityArr, function (value) {
if (value === false)
atLeastOneInvalid = true;
});
if (!atLeastOneInvalid) {
// ^ all I need is to call the angular email checker here, I think.
ctrl.$setValidity('multipleEmails', true);
return rawInput;
} else {
ctrl.$setValidity('multipleEmails', false);
return undefined;
}
});
}
};
});

Related

ServiceNow Script onSubmit not working properly

I am using ServiceNow platform. I am writing a Catalog Client Script to validate form fields on a Catalog Item record producer.
I am stopping the submission of the form by using return false if validation does not pass inspection.
I have tested this by entering invalid data (group name with special characters or a group name that exists already) and it catches the issue and shows the error message. I can enter invalid data and submit multiple times and it works.
However, the issue:
The script seems to "stop" running after I first enter invalid data and submit, and then I correct the data press the submit button again. It just sits there and does nothing. I have to reload the form again which is not desirable.
What is going on with the control flow? How can I cleanly stop the form if the data is invalid, but then allow the user to correct the mistake and press the submit button again to proceed?
I can tell that the script doesn't run again because I have an alert box popping up that says "script run" every time the script runs. It just stops running at some point after submitting invalid data first and then entering some valid data and pressing submit.
function onSubmit() {
g_form.hideAllFieldMsgs('error');
alert("script run");
//Group Name contain letters numbers and dashes only
var group_name = g_form.getValue('u_group_name');
// Group name regular expression
var regGrpName = /^([A-Za-z0-9\-]+)$/;
// Check name against regular expression
if (regGrpName.test(group_name) == false) {
g_form.showFieldMsg('u_group_name', "Group Name must contain only letters, numbers or dashes. ", 'error');
//Do not submit
//g_form.submitted = false;
return false;
}
//Check if google group already exists
var rec = new GlideRecord('u_google_user_accounts');
rec.addQuery('u_account_email', new_group_email);
rec.query();
while (rec.next()) {
g_form.showFieldMsg('u_group_name',rec.u_account_email + " already exists as an account.",'error');
return false;
}
//Group Members Email List separated by commas
// Hide error message
//g_form.hideErrorBox('u_group_members');
var group_members = g_form.getValue('u_group_members');
// Comma separate list
var member_split = group_members.split(',');
// Loop over list of email addresses
for (var n = 0; n < member_split.length; n++) {
// Trim whitespace
var member_info = trim ? member_split[n].trim() : member_split[n];
// Email validation regular expression
var regEmail = /^\w+((-\w+)|(\.\w+))*\#[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/;
// Check each item against regular expression
if (member_info.search(regEmail) == false) {
g_form.showFieldMsg('u_group_members', "Group Members contains an invalid email address. " + member_info, 'error');
//Do not submit
//g_form.submitted = false;
return false;
} else if (member_info.search(validRegExp) == true) {
g_form.setValue('u_group_members', group_members);
}
}
return true;
}
I'm glad you found a solution above, but I wanted to leave a comment as well, to ask if you've tried a try{} catch{} block to handle invalid data?
I think I have solved the issue. I made a completely separate function that checks the validation. The onSubmit calls the validation function and checks the return value. If the return value is false then it stops the form. Otherwise it is submitted even after multiple attempts with invalid data. I think this will do the trick. Let me know if anyone can see any issues. Thanks for the help.
function onSubmit() {
var isValid = checkGoogleGroup();
if (isValid == false) {
g_form.submitted = false;
return false;
}
}
function checkGoogleGroup() {
g_form.hideAllFieldMsgs('error');
//Group Name contain letters numbers and dashes only
var group_name = g_form.getValue('u_group_name');
// Group name regular expression
var regGrpName = /^([A-Za-z0-9\-]+)$/;
// Check name against regular expression
validGroupName = regGrpName.test(group_name);
if (validGroupName == false) {
g_form.showFieldMsg('u_group_name', "Group Name must contain only letters, numbers or dashes. ", 'error');
//Do not submit
return false;
}
//Check if google group already exists
var rec = new GlideRecord('u_broad_user_accounts');
rec.addQuery('u_account_email', new_group_email);
rec.query();
while (rec.next()) {
g_form.showFieldMsg('u_group_name',rec.u_account_email + " already exists as an account.",'error');
return false;
}
//Group Members Email List separated by commas
var group_members = g_form.getValue('u_group_members');
// comma separate list
var member_split = group_members.split(',');
// loop over list of email addresses
for (var n = 0; n < member_split.length; n++) {
// trim whitespace
var member_info = trim ? member_split[n].trim() : member_split[n];
// validation regular expression
var validRegExp = /^\w+((-\w+)|(\.\w+))*\#[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/;
// check each item against regular expression
if (member_info.search(validRegExp) == -1) {
g_form.showFieldMsg('u_group_members', "Group Members contains an invalid email address. " + member_info, 'error');
return false;
}
}
}

JS regular expression for social media

I want to check input for social media characters allows in username.
For example for facebook username i use this code to check username is valid or not.
var regFacebook = /[~!##$%^[^&?}{,=+/\\<>_]/
$('.txtFacebook').bind({
'keyup': function () {
$this = $(this);
if (regFacebook.test(this.value)) {
this.value = this.value.replace(regFacebook, '');
}
},
'keydown': function () {
$this = $(this);
if (regFacebook.test(this.value)) {
this.value = this.value.replace(regFacebook, '');
}
}
});
question 1 : this regEx /[~!##$%^[^&?}{,=+/\\<>_]/ not work properly for facebook, for example character ] and all utf-8 are allowed. how can resolved this?
question 2 : for googlePlus and instagram what regEx code you offer?
You shouldn't use regex to validate third-party usernames. Usernames are not part of their public API specs with guarantees. The the most you should validate is check that a value exists and then validate with the third-party service that the specific username exists.

I would like to use JQuery to validate a form unsing .inArray() and .val()

The script below is suppose to insert a message using .insertAfter() if a user doesn't type in an # symbol within a field . This script also displays an error message if the user types in a value that matches a value from the invalidEmailAddresses array.
For some reason only the second part of this script executes.
If a user types in an # symbol they get a message but if the user types in an address similar to test#yahoo.com a message doesn't display. Not sure if i organized the code correctly.
$(document).ready(function(){
$("input[name='emailAddress']").blur(function(){
// Actual Email Validation function
var hasError = false;
var emailaddressVal = $("input[name='emailAddress']").val();
var invalidEmailAddresses =
['goddady.com', 'aol.com', 'yahoo.com', 'yahoo.fr'];
if ($.inArray(emailaddressVal,invalidEmailAddresses) > 0) {
$( "<span id='emailMessage'>The email provided is not from a business related domain. Please use an appropriate email address instead.</span>" ).insertAfter( "input[name='emailAddress']" );
} else {
$ ('#emailMessage').css('display','none');
}
if ($("input[name='emailAddress']").val().indexOf('#') > -1) {
$ ('#emailMessage').css('display','none');
}
else {
$( "<span id='emailMessage'>The email provided does not contain an # symbol</span>" ).insertAfter( "input[name='emailAddress']" );
}
if(hasError == true) { return false; }
});
});
This is working if you add the following code
$(document).ready(function() {
$("input[name='emailAddress']").blur(function() {
// Actual Email Validation function
$('#emailMessage').html("");
var hasError = false;
var emailaddressVal = $("input[name='emailAddress']").val().trim();
var invalidEmailAddresses = ['goddady.com', 'aol.com', 'yahoo.com', 'yahoo.fr'];
if (!isValidEmailAddres(emailaddressVal)) {
$("<span id='emailMessage'>The email provided does not contain an # symbol</span>").insertAfter("input[name='emailAddress']");
hasError = true;
} else {
debugger
emailaddressVal = emailaddressVal.split('#').slice(1)[0].trim();
if ($.inArray(emailaddressVal, invalidEmailAddresses) >= 0) {
$("<span id='emailMessage'>The email provided is not from a business related domain. Please use an appropriate email address instead.</span>").insertAfter("input[name='emailAddress']");
} else {
$('#emailMessage').css('display', 'none');
}
}
if (hasError == true) {
return false;
}
});
function isValidEmailAddres(emailID) {
var regexExp = new RegExp(/^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))#((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i);
return regexExp.test(emailID);
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input name="emailAddress" />
The issue lies with this if conditional: if ($.inArray(emailaddressVal,invalidEmailAddresses) > 0).
Since the $.inArray() method returns the index of a string found, when a value of 0 is returned, it is actually found—but at the start of the string (position 0, because JS is zero-based). So, you should use !== -1 instead, i.e.: if ($.inArray(emailaddressVal,invalidEmailAddresses) !== -1).
However, this does not completely solve your issue — $.inArray() only compares string, it does not search for it. Therefore if your string contains the blacklisted email domains, but does not match exactly, it will return false. In this case, you should use regular expression instead. The strategy is simple: use .each() to loop through your array, and take the value, use it to construct an expression which we will test your email address that is provided against.
Also, since there is the possibility that the user-entered email address fails both tests, two <div> of identical IDs will appear. This is invalid HTML. Instead, try using a class instead.
p/s: I also recommend changing listening to .blur() to .change() instead. It is more robust :)
With all the points above considered, I have refactored your code a little:
Declare a global (but still within function scope) error array called hasError. It will be used to store all error messages you get, since we cannot be sure if there will be one, or more than one error.
We construct two tests:
To test if email matches against blacklist using the string.search(regexp) method. If there is a match, the value returned will exceed -1. We then push the relevant error message into hasError in an object
To test if email contains the # sign, we use your default logic (which works beautifully). If there is an error, we push, again, the relevant error message into hasError in an object
At the end, we evaluate hasError. If it is not empty, then we know there is an error somewhere, and loop through it. The error messages are accessible via the messages keyword :)
Without further ado, here's your code:
$(document).ready(function() {
$("input[name='emailAddress']").change(function() {
// Actual Email Validation function
var hasError = [],
emailaddressVal = $("input[name='emailAddress']").val(),
invalidEmailAddresses = ['godaddy.com', 'aol.com', 'yahoo.com', 'yahoo.fr'];
// Check against blacklist
$.each(invalidEmailAddresses, function(i, v) {
var pattern = new RegExp(v, 'i');
if (emailaddressVal.search(pattern) > -1) {
hasError.push({
'test': 'blacklist',
'message': 'The email provided is not from a business related domain. Please use an appropriate email address instead.'
});
}
});
// Check if there is an '#' character
if ($("input[name='emailAddress']").val().indexOf('#') === -1) {
hasError.push({
'test': '# sign',
'message': 'The email provided does not contain an # symbol'
});
}
console.log(hasError);
// Error handling
$('#error').remove();
if(hasError.length > 0) {
var $error = $('<div id="error"><ul></ul></div>');
$.each(hasError, function(i,v) {
$error.find('ul').append('<li>'+v.message+'</li>');
});
$error.insertAfter("input[name='emailAddress']");
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
<input name="emailAddress" type="email" />
</form>

jquery validate plugin require exact value

How can we require a user to place a specific number in a text input and validate against an exact number (or any value). In this case 001 (starting digits of an account number). The value 001 is a way to determine if the user is likely to have an account to proceed.
Am using jQuery.validate - http://jqueryvalidation.org
Have the following:
For validation I have:
$("#form1").validate({
messages: {
acn_01: {
required: 'Please enter a valid account number',
range: [001,001]
}
}
});
Range does not seem to work with [001] or [001,001]. Is there another method or technique to do this?
Thanks all.
Your code...
messages: { // <- MESSAGES option
acn_01: {
required: 'Please enter a valid account number',
range: [001,001] // <- this is not a message
}
}
The problem is that you are trying to put put rule parameters into the messages option. The messages option is for custom messages and the rules option is for declaring the rules/paramters.
$("#form1").validate({
rules: { // <- rules option
acn_01: {
required: true, // <- rule: parameter
range: [1, 1] // <- rule: parameter
}
},
messages: { // <- messages option
acn_01: {
required: 'Please enter a valid account number', // <- custom message
range: 'Please enter the number {0}' // <- custom message
}
}
});
DEMO: http://jsfiddle.net/wxfaborn/
BTW: You cannot use a string (001) or a pattern within the range method... it's only looking for a range of numbers, in this case from 1 up to 1.
EDIT:
Otherwise, you could use the pattern method (part of the additional-methods.js file) along with a regex as the parameter. Or you could use the .addMethod() method to write your own function, thereby creating a custom rule.
Here is a very simple demo of .addMethod().
jQuery.validator.addMethod("myRule", function(value, element, params) {
return this.optional(element) || value == params[0];
}, "Please enter the correct value of {0}");
$("#form1").validate({
rules: {
acn_01: {
required: true,
myRule: ["001"]
}
}, ....
http://jsfiddle.net/wxfaborn/1/
Why do you have to use this validate plugin when all your trying to do is compare the users input to "001"? Just make your own validate plugin that does what you want.
$.fn.validate001 = function(){
if(this.val()=="001")return true;
else return false;
};
$("#input").validate001();
If you need "001" to be at the beginning (but they may have numbers after that) use:
$.fn.validate001 = function(){
if(this.val().indexOf("001")==0)return true;
else return false;
};
$("#input").validate001();
Of if "001" needs to be at the end of the string use:
$.fn.validate001 = function(){
if(this.val().indexOf("001")==this.val().length-4)return true;
else return false;
};
$("#input").validate001();
I don't see a need to use a plugin for something so simple.

Email validation Javascript+RegEx, but to exclude certain domains

I have client side email validation script Javascript+RegEx, it works fine, but I want to exclude certain domains while validating, namely all Apple domains since they do not work (emails sent to these addresses are deleted without any notice): #apple.com, #me.com, #icloud.com, #mac.com.
I found appropriate questions here, but still they are not the same I am asking for help.
Please, help to implement this
Can it be done via RegEx modification, or I have to use loop and search substrings (#apple.com, #me.com, #icloud.com, #mac.com) after the main email validation is done?
function verifyMe(){
var msg='';
var email=document.getElementById('email').value;
if(!(/^\w+([\.-]?\w+)*#\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(email)) ||
document.getElementById('email').value=='')
{
msg+='- Invalid Email Address: '+email+'\n\n';
document.getElementById('Eemail').style.color='#ffffff';
}
else
document.getElementById('Eemail').style.color='#bbb'
if(msg!='')
return false;
else
{
search_code(); //it's ok go ahead
return true;
}
}
Both approaches would work.
For the regex one, just insert the following part after the # in the regex (negative lookahead):
(?!(?:apple|me|icloud|mac)\.com$)
But a better regex overall would be:
^\w+[-\.\w]*#(?!(?:apple|me|icloud|mac)\.com$)\w+[-\.\w]*?\.\w{2,4}$
For the other approach, the following should work:
function isValidMailAddress(email) {
var match = /^\w+[-\.\w]*#(\w+[-\.\w]*?\.\w{2,4})$/.exec(email);
if (!match)
return false;
var forbiddenDomains = ["apple.com", "me.com", "icloud.com", "mac.com"];
if (forbiddenDomains.indexOf(match[1].toLowerCase()) >= 0)
return false;
return true;
}
It's up to you to decide which approach you feel most comfortable with.
You can use jQuery.inArray() for checking email with a specific domain name.
var email ="abc#xyz.edu.au"
var str = email.split('#').slice(1);
var allowedDomains = ['xyz.edu.au','abc.edu.au'];
if($.inArray(str[0], allowedDomains) === -1) {
alert('email is allowed.');
}
else{
alert('email not allowed.');
}
I updated #Lucas answer to match any type of country domain (apple.com, apple.de etc.).
Moreover it should be more robust because its closer to W3C standard: https://emailregex.com/
^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+#(?!(?:yahoo|gmail|icloud|web|googlemail|aol|zoho|protonmail|outlook|hotmail|gmx|mail)[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]{1,10}$)[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$

Categories

Resources