Create a HTML form that has number of Textboxes. When the form runs in the Browser fill the textboxes with data. Write JavaScript code that verifies that all textboxes has been filled. If a textboxes has been left empty, popup an alert indicating which textbox has been left empty.

<html>
<head>
<title>Registration Form</title>
<script type = "text/javascript">
    function validate()
    {
        if(document.myForm.Name.value == "")
        {
            alert("Please Provide Your Name");
            document.myForm.Name.focus();
            return false;
        }
        if(document.myForm.Email.value == "")
        {
            alert("Please Provide Your Email ID");
            document.myForm.Email.focus();
            return false;
        }
        if ((document.myForm.Zip.value == "")||(document.myForm.Zip.value.length != 5))
        {
            alert("Please Provide a valid zip code format #####");
            document.myForm.Zip.focus();
            return false;
        }
        if(document.myForm.Country.value == "-1")
        {
            alert("Please Provide Your Country Name");
            return false;
        }
        return true;
    }
    function validateEmail()
    {
        var emailID = document.myForm.Email.value;
        atpos = emailID.indexOf("@");
        dotpos = emailID.lastIndexOf(".");
        if(atpos < 1 || (dotpos - atpos < 2))
        {
            alert("Please Enter Correct Email ID");
            document.myForm.Email.focus();
            return false;
        }
        return true;
    }
</script>
</head>
<body >
    <form  name = "myForm" onsubmit = "return(validate());" >
        <table cellspacing = "2" cellpadding = "2" border = "1">
            <tr>
                <td>Name</td>
                <td><input type = "text" name = "Name"   /></td>
            </tr>
            <tr>
                <td>Email ID</td>
                <td><input type = "text" name = "Email" onchange = "validateEmail();"/></td>
            </tr>
            <tr>
                <td>Zip Code</td>
                <td><input type = "text" name = "Zip" /></td>
            </tr>
            <tr>
                <td>Country</td>
                <td><select name = "Country" >
                        <option value = "-1" selected> [Choose Yours]</option>
                        <option value = "1" >INDIA</option>
                        <option value = "2" >USA</option>
                        <option value = "3" >Srilanka</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td colspan = "2" align = "center"><input type = "submit" value = "Submit" /></td>
            </tr>
        </table>
    </form>
</body>
</html>

3 comments:

  1. I really appreciate the information shared above. It’s of great help. If someone wants to learn Online (Virtual) instructor lead live training in #APACHE #SOLR, kindly contact us http://www.maxmunus.com/contact
    MaxMunus Offer World Class Virtual Instructor-led training on #APACHE #SOLR. We have industry expert trainer. We provide Training Material and Software Support. MaxMunus has successfully conducted 100000+ pieces of training in India, USA, UK, Australia, Switzerland, Qatar, Saudi Arabia, Bangladesh, Bahrain, and UAE etc.
    Avishek Priyadarshi
    MaxMunus
    E-mail: avishek@maxmunus.com
    Skype id: avishek_2.
    Ph:(0) 8553177744 / 080 - 41103383
    http://www.maxmunus.com/

    ReplyDelete