Form validation (Event handling) in javascript

Question

I've created a form in html and I've to validate it using JavaScript.First Name and Father's name shouldn't exceed 20 characters, so i've placed checks for them but they are working. Here's my code

<html>
    <head>
        <script type="text/javascript">
        function validate()
        {
            var firstName=document.f1.firname.value;
            var fatherName=document.f1.fname.value;
            var address=document.f1.add.value;
            var phoneNumber=document.f1.ph.value;
            var cnic=document.f1.cnic.value;
            var email=document.f1.email.value;
            var cgpa=document.f1.fname.value;
            var sem=document.f1.sem.value;
            var id=document.f1.cid.value;
            if(firstName.length>20)
            {
                alert("Value can't exceed 20");
            }
            if(fatherName.length>20)
            {
                alert("Value can't exceed 20");
            }
        }
        </script>
    </head>
    <body>
    <form name="f1">
        Name : <input type="text",name="firname">  <br>
        Father's Name: <input type="text",name="fname"> <br>
        Address: <input type="text",name="add"> <br>
        Phone No.:<input type="text",name="ph"> <br>
        CNIC:<input type="text",name="cnic"> <br>
        Email:<input type="text",name="email"> <br>
        City :<br> <input type="radio" name="city" value="lhr"> Lahore <br>
        <input type="radio" name="city" value="karachi"> Karachi <br>
        <input type="radio" name="city" value="isl"> Islamabad <br>
        <select name="country">
            <option value="pakistan">Pakistan</option>
            <option value="india">India</option>
            <option value="china">China</option>
        </select> <br>
        Cgpa:<input type="text",name="cgpa"> <br>
        Department:<input type="text",name="dpt"> <br>
        <select name="degree">
            <option value="se">SE</option>
            <option value="cs">CS</option>
            <option value="it">IT</option>
        </select> <br>
        Semester:<input type="text",name="sem"> <br>
        CollegeId:<input type="text",name="cid"> <br>
        <input type="Submit", value="Submit" ,onsubmit="validate()">
    </form>
    </body>

What seems to be the issue?

There shouldn't be any commas separating attributes in HTML, this <input type="Submit", value="Submit" ,onsubmit="validate()"> should be <input type="Submit" value="Submit" onsubmit="validate()"> — user916411
– user916411, Commented Jan 19, 2014 at 11:09

Saravana · Accepted Answer · 2014-01-19 11:15:27Z

1

Don't use commas to separate HTML attributes. It should be:

Name : <input type="text" name="firname">  <br>

and not:

Name : <input type="text",name="firname">  <br>

The onsubmit event should be for the form, not the input button.

<form name="f1" onsubmit="validate()">

answered Jan 19, 2014 at 11:15

Saravana

41k20 gold badges110 silver badges112 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Form validation (Event handling) in javascript

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related