How to check if any field of a specific class or type is empty?

Navigation
4

By programming to record multiple data of the same type or even class within the database, I came across the need to check if any of these inputs would not be empty at the time of insertion.

Since it is a form of registro de contatos which contains 10 fields that will be inserted with each send, I need a function so that these fields are processed with 10 emails at a time, neither more nor less. 

  <form role="form" id="form_cadastra" action="" method="post" enctype="application/x-www-form-urlencoded">

    <div class="form-group">
      <label for="exampleInputEmail1">E-mail 1</label>
      <input type="email" value="" class="form-control" placeholder="Enter email">
    </div>

    { ... }

    <div class="col-xs-12 col-sm-12 col-md-12">
      <button type="submit" class="btn btn-primary">Cadastrar</button>
    </div>
  </form>
    
asked by anonymous 05.10.2014 / 18:04

3 answers

8

If the inputs you want to check are emails, I usually check which element is not filled in and then visually show which element is unfilled. 

$(function () {
    $("#form_cadastra").submit(function () {
        var vazios = $("input[type=email]").filter(function() {
            return !this.value;
        }).get();

        if (vazios.length) {
            $(vazios).addClass('vazio');
            alert("Todos os campos devem ser preenchidos.");
            return false;
        } else {
            alert("Eureka");
        }
    });
});

Example: link

    
06.10.2014 / 08:50
1

I have developed this script that meets your need, knowing that you will have 10 types = email , so I created this solution that controls if all types=email is filled. You can still use a function to verify that the email is valid. 

    <script src="jquery-1.11.1.min.js" type="text/javascript"></script> 
    <script>
    $(function(){

        $("#form_cadastra").submit(function(){

            var isValid = true;
            $("input[type=email]").each(function() {

                var element = $(this);
                if (element.val() == "") { isValid = false; }

            }); // each Function

            // Função permite verificar se todos os campos estão preenchidos dentro do each 
            if(isValid == false){ alert("Todos os campos devem ser preenchidos."); return false;} 
            else { alert("Eureka"); }   

        }); // termina #form_cadastra

    }); // termina document
</script>
    
05.10.2014 / 18:04
0

Friend, since you are using an email input and a placeholder, I do not think it would be a problem to use a validation with HTML5, so just put the required property to require the field to fill in and a% so that the email is sent in a valid format. 

<form>
  <div>
    <input id="email1" type="email" required placeholder="Email" pattern="[^@]+@[^@]+\.[a-zA-Z]{2,}" />
  </div>
  <div>
    <input id="email2" type="email" required placeholder="Email" pattern="[^@]+@[^@]+\.[a-zA-Z]{2,}" />
  </div>
  <div>
    <input id="email3" type="email" required placeholder="Email" pattern="[^@]+@[^@]+\.[a-zA-Z]{2,}" />
  </div>
  <div>
    <input id="email4" type="email" required placeholder="Email" pattern="[^@]+@[^@]+\.[a-zA-Z]{2,}" />
  </div>
  <input type="submit" />
</form>
    
12.08.2015 / 17:01
Function to duplicate maturities in n parcels? Using auto reference