How to get the form parent of an input?

Question

Hi,

i need to get a reference to the FORM parent of an INPUT when I only have a reference to that INPUT. Is this possible with javascript (or else jQuery) ?

function doSomething(element) {
    //element is input object
    //how to get reference to form?
}

This doesn't work:

var form = $(element).parents('form:first');

alert($(form).attr("name"));

Answer 1

Native DOM elements that are inputs also have a form attribute that points to the form they belong to:

var form = element.form;
alert($(form).attr('name'));

According to w3schools, the .form property of input fields is supported by IE 4.0+, Firefox 1.0+, Opera 9.0+, which is even more browsers that jQuery guarantees, so you should stick to this.

If this was a different type of element (not an <input>) you could find the closest parent with closest:

var $form = $(element).closest('form');
alert($form.attr('name'));

Answer 2

Using jQuery:

function doSomething(element) {
    var form = $(element).closest("form").get().
    //do something with the form.
}

Answer 3

Every input has a form property which points to the form the input belongs to, so simply:

function doSomething(element) {
  var form = element.form;
}

Answer 4

I needed to use element.attr('form') instead of element.form

I use firefox on Fedora 12

Answer 5

Hi Paolo Bergantino,

It does not work on change event.