I have a set of text box inputs in a div, and want to color the empty
ones red (css) when a user attempts to submit incomplete fields. I've
tried this with and without an explicit iterator, as shown in the two
examples below.
(a)
$("#<%= this.pnlInputFields.ClientID %> input[class='inputFields']
[value='']").toggleClass('inputFields_empty');
(b)
$("#<%= this.pnlInputFields.ClientID %> input
[class='inputFields']").each(function(i) { $(this).toggleClass
('inputFields_empty', $.trim($(this).val()).length < 1); });
The first one fails with an error message indicating that [value='']
is an unrecognized expression (Firebug), though [value='helloworld']
works, correctly toggling the inputFields_empty class on (but not off)
wherever it finds "helloworld" in a text box. I've tried countless
variations on this, and can't seem to get it right for an empty field
(tried :empty too).
The second one (b) works, at least initially, highlighting the empty
text boxes. Not as elegant as something like (a) might be, but I'll
use it if (a) is infeasible. Note that it only works the first time
my button is pushed; subsequent changes in the textbox fields (like
the user erasing them) fail to remove the inputField_empty class (not
posting back, just have a onclick call that runs this validator
method).
Any suggestions?
