Scribd Logo
Upload

Welcome to Scribd!

  • WJP Exp 1

    Uploaded by

    20EUIT125- SAKTHI ISWARYA S
    13 views4 pages
    The document describes an experiment to validate a form using DHTML and JavaScript. It includes: Step 1) Creating an HTML form with name, date of birth, and department fields. Step 2) Adding a JavaScript function to validate the form fields when the submit button is clicked. Step 3) Using if/else statements to check that the name is correct, date of birth has the right format, and department is "IT C", displaying error messages if not valid. Step 4) If all fields validate, submitting the form. The code provided implements this form validation with JavaScript to check the form field values on submit.

    Original Description:

    Original Title

    wjp exp 1

    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 describes an experiment to validate a form using DHTML and JavaScript. It includes: Step 1) Creating an HTML form with name, date of birth, and department fields. Step 2) Adding a JavaScript function to validate the form fields when the submit button is clicked. Step 3) Using if/else statements to check that the name is correct, date of birth has the right format, and department is "IT C", displaying error messages if not valid. Step 4) If all fields validate, submitting the form. The code provided implements this form validation with JavaScript to check the form field values on submit.

    Copyright:

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

    WJP Exp 1

    Uploaded by

    20EUIT125- SAKTHI ISWARYA S
    The document describes an experiment to validate a form using DHTML and JavaScript. It includes: Step 1) Creating an HTML form with name, date of birth, and department fields. Step 2) Adding a JavaScript function to validate the form fields when the submit button is clicked. Step 3) Using if/else statements to check that the name is correct, date of birth has the right format, and department is "IT C", displaying error messages if not valid. Step 4) If all fields validate, submitting the form. The code provided implements this form validation with JavaScript to check the form field values on submit.

    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 4

    EXP .

    NO:01 SAKTHI ISWARYA S


    DATE: 12.03.2022 20EUIT125

    Exp No: 1

    Date: 12.03.2022 VALIDATE A FORM USING DHTML AND JAVASCRIPT

    AIM:
    To validate a form using DHTML and JavaScript

    ALGORITHM:

    Step 1: Start
    Step 2: Create a HTML page.
    Step 3: Form tag is defined with attributes id and action
    Step 4: Inside the form tag, 3 textboxes are created which has name, date of birth and department in it.
    Step 5: Button Send is created with on Click as attribute which calls the function verify() to validate the
    textboxes.
    Step 6: Inside script tag create a function verify() and create the variables which store the values of that
    textboxes
    Step 7: Use if conditional to check the name is equal to “Sakthi Iswarya S”, if not alert “INVALID NAME”
    Step 8: Use if conditional to check the date of birth has numerical values or not. If not display alert “Invalid
    DOB”
    Step 9: Use if conditional to check the department is IT C or not. If not IT C display alert “Only IT C
    Students are allowed”
    Step 10: Use form.submit() to submit the form
    Step 11: If all textboxes are validated correctly then display “FORM SUBMITTED SUCCESSFULLY”
    Step 12: Stop

    PROGRAM CODE:

    <!DOCTYPE html>
    <html>
    <script>
    function web()
    {
    let name=document.getElementById("name").value;
    let date_of_birth=document.getElementById("date_of_birth").value;
    let dept=document.getElementById("dept").value;
    let form=document.getElementById("SV");
    if(name!="sakthi iswarya s")
    {
    alert("name invalid");
    return false;
    }
    if(date_of_birth!="04.05.2002")
    {
    alert("DOB invalid");
    return false;
    }
    if(dept!="IT C")
    {
    EXP .NO:01 SAKTHI ISWARYA S
    DATE: 12.03.2022 20EUIT125

    alert("dept invalid");
    return false;
    }
    form.submit();
    }
    </script><center>
    <body>
    <div>
    <div style="background-color:#ebc5d5; color:white " >
    <h2> WELCOME!!!</h2>
    <h3> Fill The Details Correctly</h3></div>
    <div style="background-color:#e86ba7; color:white ">
    <form action=”success.html" id="SV">
    <i>Name:</i> <input type="text" id="name"><br><br>
    <i>DOB :</i> <input type="text" id="date_of_birth"><br><br>
    <label for="dept"><i>DEPT:</i></label>
    <select name="dept" id="dept">
    <option value="IT A">IT A</option>
    <option value="IT B">IT B</option>
    <option value="IT C">IT C</option>
    </select>
    <br>
    <br>
    <input type="button" value="validation" onclick="web()"></div>
    <div style="background-color:#dc97e6 ; color:white ">
    <b><center><h1>COPY RIGHT BY ISWARYA S</h1></center><br>
    </div>
    </body>
    </div>
    </form>
    </center>
    </html>

    SUCCESS .HTML:

    <!DOCTYPE html>
    <html>
    <head><title> success</title></head>
    <body><center><h1>Form Submitted Successfully...</h1></Center><body>
    </html>

    OUTPUT:
    EXP .NO:01 SAKTHI ISWARYA S
    DATE: 12.03.2022 20EUIT125

    NAME ERROR:

    DOB ERROR:

    DEPT ERROR:
    EXP .NO:01 SAKTHI ISWARYA S
    DATE: 12.03.2022 20EUIT125

    FORM SUBMITTED SUCCESSFULLY:

    RESULT:

    Thus, the validation of forms using DHTML and JavaScript has been implemented and verified
    successfully.

    You might also like