Jquery validate form

Question

I am trying to validate my form on submit and if the input's are all filled in they submit to register.php

My problem being it only works if all inputs are blank - otherwise it errors - I'm just trying to check if any of those fields are blank before submiting

function submitform() {
    if ($('#name, #email, #user, #address, #phone').val().length === 0) {
        $(this).addClass('warning');
    } else {
        alert("form submitted");
    }
}

Doesn't submit if all fields are blank - submits if 1 field has text and the others are blank or if they all have text and vice versa — Andrew
– Andrew, Commented Aug 10, 2012 at 21:24
Have you looked at the documentation for the jquery api you are using? — Aaron Kurtzhals
– Aaron Kurtzhals, Commented Aug 10, 2012 at 21:25
@Andrew , i don't know jQuery very well, maybe there is a better way, but try this one : if(($('#name').val() > 0) && ($('#user').val() > 0) ....) alert('submitted') else alert('blank!') BETTER WAY = Jorge's answer — Eray
– Eray, Commented Aug 10, 2012 at 21:28

Taylor Hakes · Accepted Answer · 2012-08-10 21:28:15Z

3

You cant do a .val on an array. It should be

function submitform(){
   var warning = false;
   $('#name, #email, #user, #address, #phone').each(function() {
      $(this).val().length === 0){
         warning = true;
         return;
      }
   });
   if(warning) {
      $(this).addClass('warning');
   } else {
      alert("form submitted");
   }
}

answered Aug 10, 2012 at 21:28

Taylor Hakes

6167 silver badges12 bronze badges

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

Comments

Jorge · Accepted Answer · 2012-08-10 21:38:51Z

2

you need to check each one of them with the each function in jquery, or a for loop.

$('#name, #email, #user, #address, #phone').each(function(){
    if ($(this).val().length === 0){
        $(this).addClass('warning');
    } else {
     alert("form submitted");
   }
});

Here's the same example with a for

var formElements = $('#name, #foo');

for (i = 0 ; i < formElements.length ; i++)
{
    if ( $(formElements[i]).val().length === 0 )
       $(this).addClass('warning');
    else {
       alert("form submitted");
    }
}

edited Aug 10, 2012 at 21:38

answered Aug 10, 2012 at 21:26

Jorge

18.3k19 gold badges82 silver badges129 bronze badges

Comments

user2632837 · Accepted Answer · 2013-07-30 06:17:14Z

1

function formSubmit() {
    var pass = true;
    jQuery.each( jQuery('#form :input'), function( key, value ) {
       if(!this.value && jQuery(this).attr('class :contains("required")')) {
         if (jQuery(this).siblings('.error').length === 0 && jQuery(this).type != 'submit') {
            jQuery(this).after('<label class="error"><span class="form-required">*</span> Required</label>');
         }
         pass = false;
       } else {
        jQuery(this).siblings('.error').remove();
      }
    });
    if (pass === true) {
        document.getElementById('form').submit();
    }
}

answered Jul 30, 2013 at 6:17

user2632837

111 bronze badge

Collectives™ on Stack Overflow

Jquery validate form

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related