Come ottenere la forma di contenimento di un input?

Ho bisogno di ottenere un riferimento al genitore FORM di un INPUT quando ho solo un riferimento a quell'INPUT. È possibile con JavaScript? Usa jQuery se lo desideri.

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

Questo non funziona:

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

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

Gli elementi DOM nativi che sono input hanno anche un formattributo che punta al modulo a cui appartengono:

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

Secondo w3schools , la .formproprietà dei campi di input è supportata da IE 4.0+, Firefox 1.0+, Opera 9.0+, che sono ancora più browser garantiti da jQuery, quindi dovresti attenersi a questo.

Se questo fosse un diverso tipo di elemento (non un <input>), potresti trovare il genitore più vicino con closest:

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

Inoltre, vedere questo collegamento MDN sulla formproprietà di HTMLInputElement:

• https://developer.mozilla.org/en/DOM/HTMLInputElement#Properties

Ogni input ha una formproprietà che punta alla forma a cui appartiene l'input, quindi semplicemente:

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

Uso un po 'di jQuery e javascript vecchio stile - meno codice

$($(this)[0].form) 

Questo è un riferimento completo al modulo contenente l'elemento

Utilizzando jQuery :

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

Se si utilizza jQuery e si dispone di un handle per qualsiasi elemento del form, è necessario ottenere (0) l'elemento prima di utilizzare .form

var my_form = $('input[name=first_name]').get(0).form;

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

e nell'html, devi trovare quell'elemento e aggiungere l'attributo "form" per connetterti a quel modulo, fai riferimento a http://www.w3schools.com/tags/att_input_form.asp ma questo modulo attr non supporto IE , per esempio, devi passare direttamente l'id del modulo.

Avevo bisogno di usare al element.attr('form')posto di element.form.

Uso Firefox su Fedora 12.

semplicemente come:

alert( $(this.form).attr('name') );

E ancora uno ...

var _e = $(e.target); // e being the event triggered
var element = _e.parent(); // the element the event was triggered on
console.log("_E " + element.context); // [object HTMLInputElement]
console.log("_E FORM " + element.context.form); // [object HTMLFormElement]
console.log("_E FORM " + element.context.form.id); // form id

Questo esempio di una funzione Javascript viene chiamato da un listener di eventi per identificare il modulo

function submitUpdate(event) {
    trigger_field = document.getElementById(event.target.id);
    trigger_form = trigger_field.form;

questo funzionerebbe? (lasciando in bianco l'azione, il modulo torna anche a se stesso, giusto?)

<form action="">
<select name="memberid" onchange="this.form.submit();">
<option value="1">member 1</option>
<option value="2">member 2</option>
</select>

"this" sarebbe l'elemento select, .form sarebbe il suo form genitore. Destra?