Check for empty form fields in this field only

Question

I have this code:

$("form").submit(function() {
  $(":input").each(function() {
    if($(this).val() === "")
    alert("Empty Fields!!");
  });
});

It works great but when I have more than one form on a page, it checks all forms. I wan't to check only the submitted form using the "this" selector. How shall I implement the "this" selector in my code to check only the submitted form?

I cannot use any id's or classes, only the "this" selector.

as side notes, if you don't need to suport IE<10, you should use required attribute and $(this).val() is just more boring way to write this.value ;) As kind of polyfill for required attribute: stackoverflow.com/questions/17479573/… — A. Wolff
– A. Wolff, Commented Jan 26, 2015 at 13:28

Rory McCrossan · Accepted Answer · 2015-01-26 13:26:14Z

4

Within the form submit handler you can use the this keyword to refer to the form which raised the event. Once you have that you could use find:

$("form").submit(function() {
    $(this).find(":input").each(function() {
        if ($(this).val() === "")
            alert("Empty Fields!!");
    });
});

Or a contextual selector:

$("form").submit(function() {
    $(":input", this).each(function() {
        if ($(this).val() === "")
            alert("Empty Fields!!");
    });
});

To retrieve the related input elements.

answered Jan 26, 2015 at 13:26

Rory McCrossan

338k41 gold badges322 silver badges353 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Robin Cox Over a year ago

Rory, do you know how I can filter out all submit buttons in my code?

Rory McCrossan Over a year ago

You could use :not(button), or manually place a class on the elements you want.

Collectives™ on Stack Overflow

Check for empty form fields in this field only

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related