Scribd Logo
Upload

Welcome to Scribd!

  • 40 views

    Ex 5 IP - PDF

    Uploaded by

    Norah C
    The document describes validating user input on registration, login, profile, and payment pages using JavaScript. It outlines the validation steps for each page, including ensuring required fields are filled, password requirements are met, and payment card details match valid formats. Code snippets show adding validation functions to forms and checking field values before submission. The overall goal is to enhance the user experience and prevent issues by validating input meets criteria.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd

    Ex 5 IP - PDF

    Uploaded by

    Norah C
    40 views7 pages
    The document describes validating user input on registration, login, profile, and payment pages using JavaScript. It outlines the validation steps for each page, including ensuring required fields are filled, password requirements are met, and payment card details match valid formats. Code snippets show adding validation functions to forms and checking field values before submission. The overall goal is to enhance the user experience and prevent issues by validating input meets criteria.

    Original Title

    Ex 5 IP_pdf

    Copyright

    © © All Rights Reserved

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    The document describes validating user input on registration, login, profile, and payment pages using JavaScript. It outlines the validation steps for each page, including ensuring required fields are filled, password requirements are met, and payment card details match valid formats. Code snippets show adding validation functions to forms and checking field values before submission. The overall goal is to enhance the user experience and prevent issues by validating input meets criteria.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Download as pdf or txt
    40 views7 pages

    Ex 5 IP - PDF

    Uploaded by

    Norah C
    The document describes validating user input on registration, login, profile, and payment pages using JavaScript. It outlines the validation steps for each page, including ensuring required fields are filled, password requirements are met, and payment card details match valid formats. Code snippets show adding validation functions to forms and checking field values before submission. The overall goal is to enhance the user experience and prevent issues by validating input meets criteria.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Download as pdf or txt
    of 7

    Ex.

    No :5

    Aim:

    The aim of this experiment is to validate the registration, user login, user profile, and payment by credit card pages
    using JavaScript. By implementing validation, we can ensure that the input provided by users is correct and meets the
    required criteria. This will enhance the user experience and prevent potential issues with data integrity.

    Algorithm:

    Registration Page Validation:

    1. Validate that all required fields are filled in before submitting the form.

    2. Check the validity of email addresses entered by users.

    3. Ensure that passwords meet the required complexity criteria (e.g., minimum length, containing both letters and
    numbers).

    4. Verify that password and confirm password fields match.

    5. Optionally, perform additional validation specific to your application's requirements (e.g., username
    uniqueness).

    User Login Validation:

    1. Validate that both the username/email and password fields are filled in before allowing login.

    2. Verify the entered credentials against the stored user database.

    3. Optionally, implement additional security measures like rate limiting or CAPTCHA to prevent brute-force
    attacks.

    User Profile Validation:


    1. Validate any required fields specific to the user profile page.

    2. Implement additional validation for fields like phone numbers, addresses, or other user-specific information.

    3. Ensure any changes made to the profile are correctly saved and updated in the database.

    Payment by Credit Card Validation:

    1. Validate the credit card number format (e.g., using regex) to ensure it matches a valid credit card pattern.

    2. Implement the Luhn algorithm to validate the credit card number's checksum.

    3. Verify the expiration date and CVV number against their respective criteria.

    4. Optionally, integrate with a payment gateway to perform real-time validation or verification.

    Coding:

    registration.html:

    <form id="registrationForm" onsubmit="validateRegistration(event)">

    <label for="fullName">Full Name:</label>

    <input type="text" id="fullName" required>

    <label for="email">Email:</label>

    <input type="email" id="email" required>

    <label for="password">Password:</label>

    <input type="password" id="password" required>

    <label for="confirmPassword">Confirm Password:</label>

    <input type="password" id="confirmPassword" required>

    <button type="submit">Register</button>

    </form>
    registration.js

    <script src="registration.js"></script>

    function validateRegistration(event) {

    event.preventDefault();

    const fullNameInput = document.getElementById("fullName");

    const emailInput = document.getElementById("email");

    const passwordInput = document.getElementById("password");

    const confirmPasswordInput = document.getElementById("confirmPassword");

    const fullName = fullNameInput.value;

    const email = emailInput.value;

    const password = passwordInput.value;

    const confirmPassword = confirmPasswordInput.value;

    if (!fullName || !email || !password || !confirmPassword) {

    alert("Please fill in all required fields.");

    return;

    if (password !== confirmPassword) {


    alert("Passwords do not match.");

    return;

    // Additional validation logic for registration page

    login.html

    <form id="loginForm" onsubmit="validateLogin(event)">

    <label for="loginEmail">Email:</label>

    <input type="email" id="loginEmail" required>

    <label for="loginPassword">Password:</label>

    <input type="password" id="loginPassword" required>

    <button type="submit">Login</button>

    </form>

    <script src="login.js"></script>

    login.js

    function validateLogin(event) {

    event.preventDefault();

    const emailInput = document.getElementById("loginEmail");

    const passwordInput = document.getElementById("loginPassword");


    const email = emailInput.value;

    const password = passwordInput.value;

    if (!email || !password) {

    alert("Please fill in all required fields.");

    return;

    // Additional validation logic for login page

    profile.html

    <form id="profileForm" onsubmit="validateProfile(event)">

    <label for="username">Username:</label>

    <input type="text" id="username" required>

    <label for="phone">Phone Number:</label>

    <input type="text" id="phone" required>

    <label for="address">Address:</label>

    <input type="text" id="address" required>

    <button type="submit">Save</button>

    </form>

    <script src="profile.js"></script>
    profile.js

    <form id="profileForm" onsubmit="validateProfile(event)">

    <label for="username">Username:</label>

    <input type="text" id="username" required>

    <label for="phone">Phone Number:</label>

    <input type="text" id="phone" required>

    <label for="address">Address:</label>

    <input type="text" id="address" required>

    <button type="submit">Save</button>

    </form>

    <script src="profile.js"></script>

    payment.html

    <form id="paymentForm" onsubmit="validatePayment(event)">

    <label for="cardNumber">Card Number:</label>

    <input type="text" id="cardNumber" required>

    <label for="expirationDate">Expiration Date:</label>

    <input type="text" id="expirationDate" required>

    <label for="cvv">CVV:</label>

    <input type="text" id="cvv" required>

    <button type="submit">Pay</button>

    </form>
    <script src="payment.js"></script>

    payment.js

    function validatePayment(event) {

    event.preventDefault();

    const cardNumberInput = document.getElementById("cardNumber");

    const expirationDateInput = document.getElementById("expirationDate");

    const cvvInput = document.getElementById("cvv");

    const cardNumber = cardNumberInput.value;

    const expirationDate = expirationDateInput.value;

    const cvv = cvvInput.value;

    if (!cardNumber || !expirationDate || !cvv) {

    alert("Please fill in all required fields.");

    return;

    // Additional validation logic for payment page

    Output :

    Result : The above experiment has completed successfully

    You might also like