Select the <form> element from an <input> element

Question

I'm trying to select the <form> element from an <input> element with JQuery. I've tried this:

$(".inputClass").parent("form")

but it doesn't seem to work.

Try $(".inputClass").closest("form") because the form may not be the direct parent of the input element — Arun P Johny
– Arun P Johny, Commented Dec 14, 2013 at 12:00
@ArunPJohny - Thank you. It works. If you post it like an answer I'll mark it. — Manolo
– Manolo, Commented Dec 14, 2013 at 12:03

Quentin · Accepted Answer · 2013-12-14 12:04:22Z

8

In HTML 4 you can grab the ancestor that is a form element (by using parents (plural)), but HTML 5 allows a form control to be associated with a form that it not its ancestor, so you can't rely on that.

Form controls have a form property that will give you their associated form element.

var form = $(".inputClass").prop("form");

You can turn it into a jQuery object if you like.

var $form = $( form );

Or in one line:

var $form = $( $(".inputClass").prop("form") );

answered Dec 14, 2013 at 12:04

Quentin

949k136 gold badges1.3k silver badges1.4k bronze badges

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

1 Comment

Bill Criswell Over a year ago

Never knew this existed. Awesome.

Arun P Johny · Accepted Answer · 2013-12-14 12:04:08Z

4

Try $(".inputClass").closest("form") because the form may not be the direct parent of the input element

answered Dec 14, 2013 at 12:04

Arun P Johny

389k68 gold badges532 silver badges532 bronze badges

3 Comments

Quentin Over a year ago

It is possible for a form element to not be a descendant of the form at all, so this won't always work.

Manolo Over a year ago

But this is enough for me.

A. Wolff Over a year ago

@ManoloSalsas in at least 95%(?) case, it's true, this is enough

Greg Burghardt · Accepted Answer · 2013-12-14 16:21:21Z

0

The easiest way is to use the "form" property available to every form field.

var input = document.getElementById("foo");

var form = input.form;

No jQuery needed. Just good old fashioned DOM.

answered Dec 14, 2013 at 16:21

Greg Burghardt

1

Collectives™ on Stack Overflow

Select the <form> element from an <input> element

3 Answers 3

1 Comment

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related