I have a standard old html form. I want to see if all of the input fields are empty. If you try to submit a blank form you should get an error in the form of a pop up box saying that you must enter some search criteria.
Currently I have
But this only gives me the first input. I have 5 inputs...how do I do this to all of them without giving them all an ID and doing it explicitly that way. Isn't there a way to perform this on all of the inputs?
We do stuff to all <p> tags for example, $("p").click(//do something when any <p> is clicked on);
The .attr() method can only return a single value, so it returns the value of the first matched element. So what you want to do is to attend to each matched element individually rather then en masse. To do that:
Will iterate over each matched element, invoking the passed function for each.
By the way, you probably want to be comparing to the empty string rather than null.
I looked into using different form validation plugins but none of them meet my needs. I have 5 search fields and not all of the search combinations are valid. So lets say it looks something like this...
PO Customer# Job Name Customer Name Order Number
Well PO + Custmer# is valid, but PO and Customer Name is not. Order Number can ONLY be entered by itself. This is just an example.
There aren't any plugins out there that let you write rules like that. They pretty much only make rules as to what can go into a field, not really which fields can be used in conjunction with other fields...
So I think I'm stuck writing custom code for this one...
Most validators (included the liked one) allow you to specify custom validation functions. The primary benefit (at least to me) in using this plugin, is not the execution of the validation steps, but the management of the message list.
However, doing it on your own is equally valid. Goodness knows I've done it enough myself. I hope that my $().each() tip was helpful.
Joined: Nov 19, 2007
Yes that tip was very helpful and I'm sure I'll use that knowledge some day. But for now I just stuck with my original non-jQuery way of doing it. Except I simplified 25 if/else statements down into 5. Much smaller and cleaner. I must have been drinking on the job when I originally wrote that about 3 months ago
P.S. some significant notes on the re-factored example:
The form's submit event is captured rather than the submit button's click event -- this allows the validation to occur when the form is submitted via an Enter in one of the fields in addition to any submit button
Only input text fields are checked -- buttons, radios and checkboxes are ignored
$().each() is used to loop over all text input elements
$().val() is used
The values are checked against the empty string, not null
[ April 17, 2008: Message edited by: Bear Bibeault ]
Joined: Nov 19, 2007
Thanks for the tips and the refactored solution. Very clean and much better than the one I presented. I'll keep that in my back pocket as I just made my project available for pre-production testing.
subject: Checking input values in form with JQuery