validation of form inputs in JavaScript

Question

I want to validate a input fields of form in javascript. I have searched a lot on net and always got different ways to do it. It was so confusing. I want for every single input if it is left empty an alert should popup. Here is my code

    <form method="post" action="form.html" id="FormContact" name="frm">
    <p>Full Name: <br /><br /> <input type="text" name="FullName" size="50" id="Name"></p>  

        <span id="error"></span>

    <p>Email:<br /><br /> <input type="email" name="Email" size="50" id="Mail"></p>

    <p> Subject:<br /><br /> <input type="text" name="subject" size="50" id="Subject"></p>

     Message:<br /><br /> 
     <textarea rows="15" cols="75" name="Comment" id="text">  


    </textarea> <br /><br />

     <input type="submit" value="Post Comment">
</form>

I got it done sometimes but that only worked for Full Name field.

Thanks and regards,

you should use form validation plugin like jQuery Validator jqueryvalidation.org , its well documented and full of features. — lokeshpahal
– lokeshpahal, Commented Nov 10, 2014 at 4:16

Seth Pollack · Accepted Answer · 2014-11-10 04:29:13Z

1

You can do something like this, to have an alert popup for each empty input.

$('form').on('submit', function(){
   $('input').each(function(){
     if($(this).val() === ""){
       alert($(this).attr('name') + " is empty");
     }
   });
});

answered Nov 10, 2014 at 4:29

Seth Pollack

2693 silver badges13 bronze badges

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

1 Comment

Qasim Ali Over a year ago

I want javascript's method of doing form validation. I want to validate all fields with javascript please tell me that one thanks

StingRay21 · Accepted Answer · 2014-11-10 04:16:58Z

0

http://www.w3schools.com/js/js_form_validation.asp

if you're willing to use javascript, this would be pretty easy to implement.

answered Nov 10, 2014 at 4:16

StingRay21

3621 gold badge5 silver badges16 bronze badges

1 Comment

Qasim Ali Over a year ago

I also tried this method. but it confused me because it just works for one field which is named as FullName. i dont know how to validate Email and submit with this one Because in this onsubmit is inline and only can be used once. could you please explain little?

KTAnj · Accepted Answer · 2014-11-10 04:21:37Z

use jquery validation plugin.

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
<script>

                $("#FormContact").validate({
                    rules: {
                        FullName: {
                            required:true
                        }
                    },
                    messages:{
                        FullName:{
                            required:"Please Enter FullName."
                        }
                    }
                });

            </script>

Suraj Rawat · Accepted Answer · 2014-11-10 04:27:22Z

0

USE submit method of jquery the use each loop to validate the controls

LIVE CODE

 $('form#FormContact').submit(function(){
    var i= 0;
    $('input').each(function(i,j){
        if($(this).val() == "" || $(this).val() == undefined){
            alert('empty');
            i++;
        }else{
        i=0;
        }
      })  
    if(i == 0){
    return false;
    }else{
          return true;
         }
})

answered Nov 10, 2014 at 4:27

Suraj Rawat

3,76325 silver badges33 bronze badges

Collectives™ on Stack Overflow

validation of form inputs in JavaScript

4 Answers 4

1 Comment

1 Comment

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

1 Comment

Comments

Comments

Related