Given table:

<table class="matrixA" align="center"> <tr> <td><input type="text" placeholder="a1,1"></td> <td><input type="text" placeholder="a1,2"></td> </tr> <tr> <td><input type="text" placeholder="a2,1"></td> <td><input type="text" placeholder="a2,2"></td> </tr> </table>

It is necessary to make a check on the values ​​entered into the inputs: it should not be more than 10. I have done this:

 $(".matrixA input:text").each(function () { if ($(this).val() > 10) { $('.left-block').css('backgroundColor', '#f6c1c0'); $('#error2').show(); $('#multiple').addClass('disabled'); } else { $('.left-block').css('backgroundColor', '#bcbcbc'); $('#error2').hide(); $('#multiple').removeClass('disabled'); }; });

But for some reason it only checks the last cell in the table (which is a2,2)

  • where did you get that only the last one is checked? :) - Grundy
  • @Grundy Checked somewhere, looked through the console. Just when I enter, for example, a number greater than 10 in the first cell, an error message does not come out. Also in the second and third. And in the fourth I enter - the error comes out - Ivan Berestov
  • @IvanBerestov: Here you have the following. You run through the loop, your first 3 digits are not correct and $('#error2').show(); , but the fourth digit is correct, so for the fourth run, $('#error2').hide(); your mistake is hiding. I think the removal of the whole else block before the loop will help you - user200141
  • @OleggDygtev Thank you, put on the right idea! Either the spear method worked. My whole cycle is in on (click), and before this is the code to hide both errors. Duplicated this code in on (click) - earned. - Ivan Berestov
  • @IvanBerestov: If you didn’t remove the else block, the code still doesn’t work correctly =) - user200141

2 answers 2

The essence of the error is that only one error indicator is used.

Thus, if the error was in the first element, and the necessary classes were exposed, and there was no error in the next element, the same classes will be reset.

You can decide either by a global flag, or by checking that the class is already installed, and if installed, you can not even check, because the error was somewhere before.

  • Yes Yes. If the latter is valid, then all other invalidity will be skipped. - Vladimir Morulus

Eh, I love this thing - refactoring.

 var leftBlock = $('.left-block'), error2 = $('#error2'), multiple = $('#multiple'), testForValid = function() { var valid = true; $(".matrixA input[type=text]").each(function () { // Если хотя бы одно значение не валидно, то валим всю проверку if (parseInt($(this).val()) > 10) valid = false; }); leftBlock.css('backgroundColor', valid?'#f6c1c0':'#bcbcbc'); error2[valid ? 'show' : 'hide'](); multiple[valid ? 'addClass' : 'removeClass']('disabled'); }
  • I'd rather not touch :) - Grundy
  • But only there is a cant) Conceptual - Vladimir Morulus
  • Valid you can not see the outside of the function. - Jean-Claude
  • @ Jean-Claude and do not need - Vladimir Morulus