Scribd Logo
Upload

Welcome to Scribd!

  • Tutorial J5

    Uploaded by

    hellloo
    43 views6 pages
    The document provides instructions on using JavaScript functions and conditional statements like if/else and switch to validate a user's login credentials. It has the learner create a login validation program using prompts for username and password, then check for a match using if/else statements and improve it to use a switch statement to handle different validation cases. The final code sample shows how to use a switch statement to validate login and display customized error messages.

    Original Description:

    Copyright

    © © All Rights Reserved

    Available Formats

    DOCX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    The document provides instructions on using JavaScript functions and conditional statements like if/else and switch to validate a user's login credentials. It has the learner create a login validation program using prompts for username and password, then check for a match using if/else statements and improve it to use a switch statement to handle different validation cases. The final code sample shows how to use a switch statement to validate login and display customized error messages.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as docx, pdf, or txt
    43 views6 pages

    Tutorial J5

    Uploaded by

    hellloo
    The document provides instructions on using JavaScript functions and conditional statements like if/else and switch to validate a user's login credentials. It has the learner create a login validation program using prompts for username and password, then check for a match using if/else statements and improve it to use a switch statement to handle different validation cases. The final code sample shows how to use a switch statement to validate login and display customized error messages.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as docx, pdf, or txt
    of 6

    Tutorial J5

    Aim: To learn about basic JavaScript and using functions and conditional statements

    Name: ____________Tan Wan Sean___________________ Date:


    _________________

    1. Draw a flow chart for a JavaScript program to check a person’s username and password:

    Start

    Insert Username
    and password

    Use javascript program


    to check whether the
    username and password No
    are correct

    End
    Open a text editor of your choice, such as Notepad (on Windows) or TextEdit (on a Mac). Create
    an HTML page leaving space between <body> and </body> tags. Between the <body> and
    </body> tags add the <script> and </script> tags.

    2. Here is the code to check the user’s username. Try it out:


    3. Now amend the code above to also check for password. Can your program check for both
    username and password? Try using the && operator.

    <!DOCTYPE html>
    <html>
    <body>

    <h2>What Can JavaScript Do?</h2>

    <script>
    var userID
    var password
    var ReturnValue

    userID = prompt('Enter user Id',' ');


    password = prompt('Please enter your password:','');

    if (userID == 'ScoobyDoo' && password =='blackpink')


    {
    alert('Valid Logon');
    }
    else
    {
    alert('Invalid Logon');
    }

    </script>

    </body>
    </html>
    4. Amend the code above to use a function to validate the username and password.

    <!DOCTYPE html>
    <html>
    <body>

    <h2>What Can JavaScript Do?</h2>

    <script>
    var userID
    var password
    var ReturnValue

    userID = prompt('Enter user Id',' ');


    password = prompt('Please enter your password:','');
    if (userID == 'ScoobyDoo'&& password =='blackpink')

    function validate()
    {
    alert('Valid Logon');
    }
    else
    {
    alert('Invalid Logon');
    }

    </script>

    </body>
    </html>
    5. Using switch statements. Try out the code below to understand the use of switch:

    6. Now let’s say we want to improve the earlier program by giving the following messages:
    Case 1: Valid logon (username and password correct)
    Case 2: Invalid logon - Username correct, password wrong
    Case 3: Invalid logon - Username wrong, password correct
    Case 4: Invalid logon - Both username and password wrong

    Using the following switch statements improve your program to display the messages.

    switch (valid)
    {
    case 1:
    alert('Valid Logon')
    break
    case 2:
    alert('Valid User ID. Invalid Password.')
    break
    case 3:
    alert('Invalid user ID. Valid Password.')
    break
    case 4:
    alert('Invalid User ID and Password')
    break

    7. Complete the code above and test it out.


    <!DOCTYPE html>
    <html>
    <body>

    <h2>What Can JavaScript Do?</h2>

    <script>

    var userID
    var password
    var ReturnValue

    userID = prompt('Enter user Id',' ')


    password = prompt('Enter password:','')

    switch (true)
    {
    case(userID == 'ScoobyDoo' && password == 'blackpink'): alert("Valid Logon")
    break;
    case(userID == 'ScoobyDoo' && password!== 'blackpink'): alert("Valid User ID.Invalid Password")
    break;
    case(userID !== 'ScoobyDoo' && password == 'blackpink'): alert("Invalid Use ID")
    break;
    case(userID !== 'ScoobyDoo' && password !== 'blackpink'): alert("Invalid User ID and password")
    break;
    }

    </script>
    </body>
    </html>
    References:
    1. https://www.w3schools.com/js/default.asp
    2. https://www.w3schools.com/js/js_functions.asp
    3. https://www.w3schools.com/js/js_switch.asp
    4. JavaScript Demystified, Chapter 5 by Jim Keogh

    You might also like