How to check if multiple dynamically created input is empty?

Question

How to check if multiple dynamically created input is empty?

Navigation

#1 by (2 votes)
#2 by (1 votes)

0

I have this Input that is generating via Knockoutjs:

<input type="text" class="req" placeholder="" data-bind="value:Request" />

But I have to check if it is empty and if a specific css is applied: As many fields can be created the same, I can only apply my validation in the first field.

My JavaScript:

if ($(".req").val() == "") { 
    $(".req").addClass(validationClassErrosType.input)
}
validationCheckImage($("#req"), $("#req").parent());

The input image:

Well, he always takes the class first. how could I do this via javaScript?

javascript css knockoutjs

asked by anonymous 03.08.2017 / 15:25

2 answers

1

Try this:

for(var x = 0; x < $('.req').length; x++){
 if($('.req')[x].val() === ""){
  console.info("Adicionar Css");    
 }
}

03.08.2017 / 15:28

Form data is not being registered jquery n.fn.init (0) in test production n.fn.init (1)

score 2 · Accepted Answer

I made a basic example with jQuery, see if it can adapt to your case.

$('#testarInputs').click(function(){
  $('.teste').each(function(){
    if(this.value == ''){
      $(this).css('border','1px solid red');
    }else{
      $(this).css('border','');
    }
  }); 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><inputclass="teste">
<input class="teste">
<input class="teste">
<input class="teste">
<input class="teste">
<input class="teste">
<input class="teste">
<input class="teste">
<input class="teste">

<input type="button" id="testarInputs" value="Testar">