reg validation

Here's an example validation for registration, user login, user profile, and payment pages using JavaScript:

Registration Page Validation

// Registration form validation
const registerForm = document.getElementById('register-form');

registerForm.addEventListener('submit', (e) => {
  e.preventDefault();

  const username = document.getElementById('username').value.trim();
  const email = document.getElementById('email').value.trim();
  const password = document.getElementById('password').value.trim();
  const confirmPassword = document.getElementById('confirm-password').value.trim();

  if (username === '') {
    alert('Username is required');
    return;
  }

  if (email === '') {
    alert('Email is required');
    return;
  }

  if (!validateEmail(email)) {
    alert('Invalid email format');
    return;
  }

  if (password === '') {
    alert('Password is required');
    return;
  }

  if (password.length < 8) {
    alert('Password must be at least 8 characters');
    return;
  }

  if (password !== confirmPassword) {
    alert('Passwords do not match');
    return;
  }

  // Register user logic here
});

// Email validation function
function validateEmail(email) {
  const emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
  return emailRegex.test(email);
}


Login Page Validation

// Login form validation
const loginForm = document.getElementById('login-form');

loginForm.addEventListener('submit', (e) => {
  e.preventDefault();

  const email = document.getElementById('email').value.trim();
  const password = document.getElementById('password').value.trim();

  if (email === '') {
    alert('Email is required');
    return;
  }

  if (!validateEmail(email)) {
    alert('Invalid email format');
    return;
  }

  if (password === '') {
    alert('Password is required');
    return;
  }

  // Login user logic here
});

// Email validation function
function validateEmail(email) {
  const emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
  return emailRegex.test(email);
}


User Profile Validation

// Profile form validation
const profileForm = document.getElementById('profile-form');

profileForm.addEventListener('submit', (e) => {
  e.preventDefault();

  const name = document.getElementById('name').value.trim();
  const email = document.getElementById('email').value.trim();
  const phone = document.getElementById('phone').value.trim();

  if (name === '') {
    alert('Name is required');
    return;
  }

  if (email === '') {
    alert('Email is required');
    return;
  }

  if (!validateEmail(email)) {
    alert('Invalid email format');
    return;
  }

  if (phone === '') {
    alert('Phone number is required');
    return;
  }

  if (!validatePhone(phone)) {
    alert('Invalid phone number format');
    return;
  }

  // Update profile logic here
});

// Email validation function
function validateEmail(email) {
  const emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
  return emailRegex.test(email);
}

// Phone number validation function
function validatePhone(phone) {
  const phoneRegex = /^\d{3}-\d{3}-\d{4}$/;
  return phoneRegex.test(phone);
}


Payment Page Validation

// Payment form validation
const paymentForm = document.getElementById('payment-form');

paymentForm.addEventListener('submit', (e) => {
  e.preventDefault();

  const cardNumber = document.getElementById('card-number').value.trim();
  const expirationDate = document.getElementById('expiration-date').value.trim();
  const cvv = document.getElementById('cvv').value.trim();

  if (cardNumber === '') {
    alert('Card number is required');
    return;
  }

  if (!validateCardNumber(cardNumber)) {
    alert('Invalid card number format');
    return;
  }

  if (expirationDate === '') {
    alert('Expiration date is required');
    return;
  }

  if (!validateExpirationDate(expirationDate)) {
    alert('Invalid expiration date format');
    return;
  }

  if (cvv === '') {
    alert('CVV is required');
    return;
  }

  if (!validateCVV(cvv)) {
    alert('Invalid CVV format');
    return;
  }

  // Process payment logic here
});

// Card number validation function
function validateCardNumber(cardNumber) {
  const cardNumberRegex = /^(\d{4}[- ]?){4}$/;
  return cardNumberRegex.test(cardNumber);
}

// Expiration date validation