Validating email using js - javascript

I trying to create this form that only allows people to submit an email that is using a #msu.edu email. I have the alert that is coming up when it's not a msu.edu email, but when I use an email like test#msu.edu its not submitting the form.
function checkMail() {
var email = document.validation.email.value.toLowerCase();
var filter = /^([\w-]+(?:\.[\w-]+)*)#msu.edu/i;
var result = filter.test(email);
alert('Valid email found: ' + result);
return result;
}

You need to escape the . there.
Correct code:
function checkMail() {
var email = document.validation.email.value.toLowerCase();
var filter = /^([\w-]+(?:\.[\w-]+)*)#msu\.edu/i;
// ^-- escape this dot
var result = filter.test(email);
alert('Valid email found: ' + result);
return result;
}
Demo

Format in just like this... var filter = /^([\w-]+(?:\.[\w-]+)*)#msu\.edu/i; as per Gaurang said. It works.

why not try this
bool IsValidEmail(string email)
{
try {
var addr = new System.Net.Mail.MailAddress(email);
return true;
}
catch {
return false;
}
}

This will do it
put this function onclick event of button and change getelementById's Id with your TextBox Id and this will give you alert "msu.edu"
function checkMail()
{
var email = document.getElementById("email").value.toLowerCase();
var regex = /^(([^<>()[\]\\.,;:\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,}))$/; ;
if (regex.test(email))
{
var temp = email.substring(email.lastIndexOf("#")+1);
if (temp != "msu.edu")
{
alert("Enter correct email");
}
}
}

Related

How can I create a function to validate an email and a username with a Javascript?

I'm very new in coding. I'm creating a newsletter form and I'll need people to register by entering a name (only letters) and a valid email address.I'm trying to create a javascript function but it does not work properly. Function is:
function validaIscrizione(username,email) {
var nameRegex = /^[a-zA-Z\-]+$/
var emailRegex = /^(([^<>()[\]\\.,;:\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,}))$/
if(
username==''|| username==undefined || nameRegex.test(username)||
email== '' || email == undefined || emailRegex.test(email)
)
{return false;}
else{return true;}
}
var button = document.getElementById('btn_1');
button.onclick=function(){
var login=document.getElementById('username').value;
var password=document.getElementById('email').value;
var result = document.getElementById('result');
if(validaIscrizione(username,email)){
result.innerHTML = "Grazie per aver effettuato la registrazione";
}else{
result.innerHTML = "Dati non validi";
}
}
"
am I missing something? Thank you in advance
I modify a little your validate function and put comments with the explanation:
function validaIscrizione(username, email) {
const nameRegex = /^[a-zA-Z\-]+$/;
const emailRegex = /^(([^<>()[\]\\.,;:\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,}))$/;
// here you use short circuit for the falsy values like "" or undefined and validate the regex
const isUsernameValid = username && nameRegex.test(username);
const isEmailValid = email && emailRegex.test(email);
// here you return that is valid only if the two inputs pass your tests
return isUsernameValid && isEmailValid;
}

Why is my email validation not returning an error message I did set?

I made an email validation through Javascript. I know we can do validation through HTML, but I need to use Javascript. There are two methods that I used in this problem. First is conditioning, and second is regular expression matching. If an input email is wrong, then an error message will appear beside it, and if there's no error the form will direct to a PHP page. In my case, I input an email that I expect to get an error from, but it directs to the PHP page immediately, which is wrong.
What I want is there should be no '.' and '#' in the first and last index of the email
There should be an # and . as per the usual email structure
There should only be 1 # character
All characters are included.
Here is my javascript code after the html one,
const name = document.getElementById('name')
const lname = document.getElementById('lname')
const co = document.getElementById('co')
const email = document.getElementById('email')
const form = document.getElementById('form')
const error1 = document.getElementById('error1')
const error2 = document.getElementById('error2')
const error3 = document.getElementById('error3')
const error4 = document.getElementById('error4')
form.addEventListener('submit', (e) => {
let messages = []
var re =/^[A-Za-z]+$/;
if(!name.value.match(re)){
messages.push('error')
var err1="Contains number";
}
else{
err1="";
}
if(!lname.value.match(re)){
messages.push('error')
var err2="Contains number";
}
else{
err2="";
}
var t=co.value;
//we have a problem in contact number
if(t[4]!='-'||t[8]!='-'||t[0]!=0||t[1]!=9||t.length!=13){
messages.push('error')
var err3="Must follow the format";
}
else{
err3="";
}
var m=email.value;
var r=email.value.length;
var atposition=email.indexOf("#");
var dotposition=email.lastIndexOf(".");
var i, count, dot1;
for(i=0; i<r; i++){
if(m[i]=='#'){
count++;
}
if(m[i]=='.'){
dot1++;
}
}
if(atposition<1||atposition==m[r-1]||count>1||dotposition==m[r-1]||m[0]=='.'||dot1==0||count==0){
messages.push('error')
err4.push('Must follow email format')
}
if (messages.length > 0) {
e.preventDefault()
error1.innerText = err1
error2.innerText = err2
error3.innerText = err3
error4.innerText = err4
}
})
Here is my method on regular expression matching:
var re=/^[\w-\.]+#([\w-]+\.)+[\w-]{2,4}$/
if(!email.value.match(re)){
messages.push('error')
err4.push('Must follow email format')
}
try this one.
var mailformat = /^([a-zA-Z0-9_\.\-])+\#(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]
{2,4})+$/;
var email = $('#email').val();
if(!mailformat.test(email_value)){
e.preventDefault();
$('#error-email-txt').html('Enter valid email address');
$('#error-email').css("display",'block');
}

Multiple email validation regex with semicolon in javascript

Multiple email validation regex with semicolon in Javascript
It can allow mulptiple emails and can allow the semicolon after email id. If only one email id provided then it can allow with or without semicolon.
I tried below code:
<script type = "text/javascript" >
function myFunction() {
var email = document.getElementById("email").value;
var reg = /^([a-zA-Z0-9_\-\.]+)#([a-zA-Z0-9\-]+\.)+([a-zA-Z0-9\-\.]+)+([;]([a-zA-Z0-9_\-\.]+)#([a-zA-Z0-9\-]+\.)+([a-zA-Z0-9\-\.]+))*$/;
if (reg.test(email) == false) {
alert("Entered email id is not valid")
return false;
} else {
alert("Entered email id is valid")
return true;
}
}
</script>
Try this approach.
It splits email list into individual addresses and loops over all of them. Also, it uses much simplified regex to check email validity.
Also, checking for validity of one email on the list should be more robust, this is only an example.
var email = document.getElementById("email").value;
console.log("Are emails valid: " + checkEmailValidity(email));
function checkEmailValidity(emailList) {
var reg = /^.+?#.+?\.\w{2,}$/i;
var emailArr;
if (emailList.indexOf(";") < emailList.indexOf("#")) {
//assume only one email address on the list
emailArr = [emailList];
} else {
emailArr = emailList.split(";")
}
var isValid = true;
emailArr.forEach(function(addr) {
if (reg.test(addr) === false) {
console.log("One of the emails is not valid: " + addr);
isValid = false;
}
})
return isValid;
}

Validate forms using javascript

I want to validate 3 inputs (name, email and password) in a form using javascript. When the user submits the form, and all the fields are empty, it works correctly showing the error messages. But then if I write a correct password (length 7) and wrong email and name, and I try to submit the form again the "Password too short" message is stil there and the password is correct. What I am doing wrong?
Javascript file
function verify(){
if(verName()&verEmail()&verPassword())
{
return true;
}else
{
verName();
verEmail();
verPassword();
return false;
}
}
function verPassword(){
var ok = true;
var frm = document.getElementById("register");
var pass = frm.elements[2].value;
if(pass.length<6)
{
var text="Password too short";
document.getElementById('textPassword').innerHTML=text;
ok = false;
}
return ok;
}
HTML file
<form id='register' name='register' onsubmit="return verify()">
function verify(){
document.getElementById('textPassword').innerHTML = ' ';
if(verName()&verEmail()&verPassword())
{
return true;
}else
{
verName();
verEmail();
verPassword();
return false;
}
}
change your code it like this:
function verify(){
if(verName()&verEmail()&verPassword())
{
return true;
}
else
{
if(verName());
if(verEmail());
if(verPassword());
return false;
}
}
with this solution, each validation occurs if the previous validation runs true! and if not, just the previous validation errors shows up !
in each function verName(), verEmail() and verPassword(), return Boolean value of TRUE of FALSE
also add this line of code, on your form submit event:
verify() {
document.getElementById('textPassword').innerHTML= ' '
....
....
}
The problem is that your verPassword function is adding that error string when the password is invalid, but it doesn't remove it when the password is valid.
Also, your verify function makes little sense.
How about:
function verify(){
return verName() && verEmail() && verPassword();
}
function verPassword(){
var frm = document.getElementById("register");
var pass = frm.elements[2].value;
var ok = pass.length > 5;
var text = ok ? "" : "Password too short";
document.getElementById('textPassword').innerHTML=text;
return ok;
}
You have to empty the #textPassword element by write something like: document.getElementById('textPassword').innerHTML.
In addition I can see some wrong codes there. First, if every ver* function returns true or false, you better use && rather than & in if condition expression. Or you can just return the evaluated value of the condition expression like this: return verName() && verEmail() && verPassword().
Second, the ver* functions are already called while if evaluate condition expression. No need to call those functions again in else part.
And I don't think you need ok variable in verPassword() function.
I suggest to change the code like below:
function verify(){
return verName() && verEmail() && verPassword();
}
function verPassword(){
var frm = document.getElementById("register");
var pass = frm.elements[2].value;
var textPassword = document.getElementById('textPassword');
if (pass.length < 6) {
var text="Password too short";
textPassword.innerHTML = text;
return false;
} else {
textPassword.innerHTML = ""; // Empty #textPassword
return true;
}
}

Loading form input fields into a javascript array and then validating

I seem to be really stuck on something. I have a function to check if all the form input fields are equal to null or "" which is all fine but wanted to see if there is another way of doing it by loading all the fields into a javascript array and then doing a for loop along with an if statement to check if any of the fields are empty, unfortunately I can't seem to get this to work and wondering if I've simply just missed something some where. Here is my code:
function checkempty()
{
fname = document.getElementById("firstname").value;
lname = document.getElementById("lastname").value;
fage = document.getElementById("age").value;
addressl1 = document.getElementById("addressline1").value;
addressl2 = document.getElementById("addressline2").value;
ftown = document.getElementById("town").value;
fcounty = document.getElementById("county").value;
fpcode1 = document.getElementById("pcode1").value;
fpcode2 = document.getElementById("pcode2").value;
ftelephone = document.getElementById("telephone").value;
fcomment = document.getElementById("comment").value;
var myArray = [];
myArray[0] = fname;
myArray[1] = lname;
myArray[2] = fage;
myArray[3] = addressl1;
myArray[4] = addressl2;
myArray[5] = ftown;
myArray[6] = fcounty;
myArray[7] = fpcode1;
myArray[8] = fpcode2;
myArray[9] = ftelephone;
myArray[10] = fcomment;
for(i=0;i<myArray.length;i++)
{
if(!myArray[0])
{
return true;
}
}
return false;
}
I then use another function:
function checkform()
{
if(checkempty)
{
display_errormessage("One or more fields empty!");
}
else
{
alert("Thanks for you input!");
}
}
The display_errormessage() function is just one that puts an error message into a div at the top of the form to display an error message if the form is incomplete.
Can anyone see where i've gone wrong?
Thanks in advance for any help!
Dave.
First, function checkform is not called. The if (checkform) should be if (checkform()) or you will test only test the availability of the function, not the result.
Then the if (!myArray[0]) should be if (!myArray[i]) to not only test the firstname
Or better, if (myArray[i].length==0) to be sure to explicitly test for empty string and not just doing an implicit boolean conversion (javascript evaluate 0=="" as true)
if(!myArray[0]) should be if(!myArray[i]), but a larger point is you're only validating that the value isn't falsey (null, '', 0, false, etc.), not that it's appropriate for the task.
Guess you won't need this function as you've already fixed yours, but I'll leave it here as it may be helpful in the future. JSFiddle
function checkform()
{
arr1 = document.getElementsByTagName('input');
arr1 = Array.prototype.slice.call(arr1);
arr2 = document.getElementsByTagName('textarea');
arr2 = Array.prototype.slice.call(arr2);
arrs = arr1.concat(arr2);
for(i=0;i<arrs.length;i++)
{
if (arrs[i].type == "text" || arrs[i].type == "textarea")
{
if (arrs[i].value == '')
{
alert("Fill all fields before submitting!");
return false;
}
}
}
alert("Thanks for your input!");
return true;
}
According that your input fields are in the form named form:
var allTrue = [].every.call( document.forms.form.elements, function( el ) {
return !!el.value;
} );
if ( allTrue ) {
alert( "Thanks for your input!" );
}
else {
alert( "Some fields are missing!" );
}

Categories

Resources