CODEWITHSUNDEEP
jquery
felix001
felix001

Reputation: 16691

Validate multiple inputs on Submit

Can anyone help I'm trying to validate multiple inputs to ensure that they aren't empty at the point I submit. And then add some text into #error.

My form looks like this :

<div class="span12">
        <form method="post" name="bdayInputFormMain" action="/bdayremind_maininput/" class="form-inline">
        {% csrf_token %}
                <input name="name" type="text" class="input-medium" placeholder="Name">
                <input name="dob" type="text" class="input-small datepicker" placeholder="Date of Birth">
                <input name="addr" type="text" class="input-xlarge" placeholder="Address">
                <button type="submit" class="btn">Update</button>
        </form>
</div>

Thanks,

Upvotes: 0

Views: 144

Answers (3)

Miguel &#193;ngel D&#225;vila Carrasco
Miguel &#193;ngel D&#225;vila Carrasco

Reputation: 11

Yeah! The jquery validation is one of the best validator for client. You should use required class for those field required.

See the doc http://docs.jquery.com/Plugins/Validation

Your form would look like this:

http://jsbin.com/elemad/3/edit

I hope it helps!

Upvotes: 0

Shibbir Ahmed
Shibbir Ahmed

Reputation: 1350

This validation library, Parsley.js, looks pretty nice and may meet your needs.

Upvotes: 0

user2033671
user2033671

Reputation:

Check out the documentation for .submit(). It is fairly easy to write your own validation method, or you can use a library like others have suggested.

http://jsfiddle.net/rwFDT/

$('form').submit(function(){
   var $emptyFields = $();
   $('form').find('input').each(
       function(){
              if($(this).val() == ""){
                   $emptyFields.push(this)
             }
        });
  if($emptyFields.length != 0){
    $('form').find('input').css("border","");
    $emptyFields.css("border", "1px solid red");
    $("#error").html("<b><i>This is my error message</i></b>");
    return false;
  }else{
    return true;
  }
});

Upvotes: 1

Related Questions