0% found this document useful (0 votes)
27 views3 pages

New Text Document

Uploaded by

Kingsley Esedebe
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
27 views3 pages

New Text Document

Uploaded by

Kingsley Esedebe
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 3

// function usernameValidate (username){

// let pattern = /^[a-z]{7}\W{1}\d{1}$/i


// if (pattern.test(username)){
// return true
// }else {
// return false
// }
// }

// function emailValidate (email){


// let pattern = /\w\W@(gmail|yahoo|hotlook)\.com$/i
// if (pattern.test(email)){
// return true
// }else {
// return false
// }
// }

// while(true){
// const username = prompt(`what is your name`)
// let usercheck = usernameValidate(username)

// if(usercheck === true){


// alert(`welcome ${username}`)
// break;
// }else {
// alert(`invalid username`)
// break;
// }

// const email = prompt(`enter your email address`)


// let emailconfirm = emailValidate(email)

// if(emailconfirm === true){


// alert(`your email address is valid`)
// break;
// }else {
// alert(`invalid email address`)
// break;
// }
// }

const mouseon = document.getElementById("First name")


mouseon.addEventListener("mouseenter",()=>{
alert("the mouse is on me")
})

const mouseleave = document.getElementById("Last name")


mouseleave.addEventListener("mouseleave",()=>{
alert("the mouse left me")
})

const click = document.getElementById("email")


click.addEventListener("click",()=>{
alert("i have been clicked")
})
const dragend = document.getElementById("password")
dragend.addEventListener("dragend",()=>{
alert("i have been dragged")
})

// function usernameValidate (Firstname){


// let pattern = /^\w{{7}$/i
// if (pattern.test(Firstname)) {
// return true
// }else {
// return false
// }
// }

// while(true){
// const Firstname = alert(`what your name`)
// let usercheck = usernameValidate(Firstname)

// if (usercheck === true){


// alert(`welcome${Firstname}`)
// break;
// }else {
// alert(`invalid Firstname`)
// break;
// }
// }

// const body = document.body;


// body.style.cssText =`
// margin: 0; display: flex; justify-content:center; align-item: center; height:
100vh; backgroundcolor:#f3f3f3;`

// const formContainer = document.createElement("div");


// formContainer.style.cssText = `width: 400px; background:white; padding:20px;
border-radius:8px; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); font-family: arial,
san-serif`;
// body.appendChild(formContainer);

// //add a title to the form


// formContainer.innerHTML = `
// <h2 style>`

document.addEventListener("DOMContentLoaded", ()=> {
//get refrence o the existing boxes by their IDs
const firstname = document.getElementById("firstname");
const lastname = document.getElementById("lastname");
const email = document.getElementById("email");
const password = document.getElementById("password");
const telephone = document.getElementById("telephone")

//patterns for Validation


const firstNamePattern = /^\w{5}$/;
const lastNamePattern = /^[a-z]{6}$/i;
const emailPatten = /\w{5}}@(gmail|yahoo|hotlook)\.com$/i;
const passwordPattern = /\w{4}/;
const telephonePattern = /^\d{11}$/;
})
//add event listener for form submission
const form = document.getElementById("myForm");
form.addEventListener("submit", (Event) => {
Event.preventDefault(); //prevent form submission

//sequentialValidation
if (!firstNamePattern.test(firstName.value)) {
alert("First Name must be 5 alphabet");
firstName.focus();
return;
}

if (!lastNamePattern.test(lastname.value)) {
alert("Last Name must be 6 alpahbet");
lastName.focus();
return;
}
if (!emailPatten.test(email.value)) {
alert("please enter a valid email address\nthe email shoulb be 5 alphabets
folowed by @ and whatever mail you use");
email.focus();
return;
}

if (!passwordPattern.test(password.value)) {
alert("passwprd should contain only 4 alphabet");
password.focus();
return;
}

if (!telephonePattern.test(telephone.value)) {
alert("phine number must be exactly 11 digits.");
telephone.focus();
return;
}

//if all conditions are met


alert("All inputs are valid proceeding to the next step.........");
})

You might also like