इनपुट का फॉर्म कैसे प्राप्त करें?

Question

जब मुझे केवल उस INPUT का संदर्भ मिलता है, तो मुझे INPUT के FORM माता-पिता का संदर्भ प्राप्त करना होगा। क्या यह जावास्क्रिप्ट के साथ संभव है? पसंद आने पर jQuery का प्रयोग करें।

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

यह काम नहीं करता है:

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

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

Answer 1

मूल डोम तत्व जो इनपुट हैं उनमें एक formविशेषता भी है जो उस रूप में इंगित करता है जो उनके पास है:

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

W3schools के अनुसार , .formइनपुट फ़ील्ड्स की संपत्ति IE 4.0+, फ़ायरफ़ॉक्स 1.0+, ओपेरा 9.0+ द्वारा समर्थित है, जो कि और भी ब्राउज़र है जो jQuery गारंटी देता है, इसलिए आपको इस पर रहना चाहिए।

यदि यह एक अलग प्रकार का तत्व था (नहीं <input>), तो आप निकटतम माता-पिता को पा सकते हैं closest:

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

इसके अलावा, इस MDN की formसंपत्ति पर लिंक देखें HTMLInputElement:

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

Comments

ठीक है यह काम करता है .. प्रपत्र विशेषता के बारे में। मैंने बस कोशिश की और वह भी काम करता है। लेकिन यह आपके द्वारा कहे जा रहे ब्राउज़रों के लिए समर्थित नहीं है?

— 19st में रोपस्टाह

मुझे पूरा यकीन है कि यह है। मैं सिर्फ 100% निश्चित नहीं हूं इसलिए मैं कुछ भी वादा नहीं करना चाहता। मैं इसे अभी देख रहा हूँ ...

— पाओलो बर्गैनिनो

Element.form का प्रयोग करें - यह jQuery की तुलना में अधिक ब्राउज़रों पर काम करेगा। यह एक संपत्ति संदर्भ भी है, इसलिए डोम ट्री को निकटतम () के साथ चलने की तुलना में लगभग एक हजार गुना अधिक कुशल होगा।

— निकित्ज़

मैं सहमत हूँ। जैसा कि मैंने कहा, मुझे अभी शुरू में यकीन नहीं था कि अगर फॉर्म प्रॉपर्टी को सभी सामान्य ब्राउज़रों में बड़े पैमाने पर लागू किया गया था। मैंने अपना उत्तर अधिक स्पष्ट रूप से सूचीबद्ध करने के लिए बेहतर विकल्प के रूप में संपादित किया है, जबकि मैं एक tidbit के रूप में निकटतम छोड़ रहा हूं यदि यह एक अलग प्रकार का तत्व था।

— पाओलो बर्गीनो

यह अन्य इनपुट प्रकारों जैसे चयन के साथ भी काम करता है। जानकार अच्छा लगा।

— फॉक

Answer 2

प्रत्येक इनपुट में एक formगुण होता है जो इनपुट के रूप में इंगित होता है, इसलिए बस:

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

Answer 3

मैं jQuery और पुरानी शैली जावास्क्रिप्ट के एक बिट का उपयोग करता हूं - कम कोड

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

यह तत्व से युक्त रूप का पूर्ण संदर्भ है

Comments

आप मूल रूप से कह रहे हैं "इसे एक jQuery ऑब्जेक्ट बनाएं और फिर इसे jQuery ऑब्जेक्ट न बनाएं"।

— isherwood

geez, बस क्यों नहीं कर रहा $(this.form)?

— आंद्रे फिग्यूएरेडो

Answer 4

JQuery का उपयोग करना :

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

Answer 5

यदि jQuery का उपयोग कर रहे हैं और किसी भी प्रकार के तत्व के लिए एक संभाल है, तो आपको उपयोग करने से पहले तत्व (0) प्राप्त करने की आवश्यकता है

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

Answer 6

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

और html में, आपको उस तत्व को खोजने की जरूरत है, और उस फ़ॉर्म से जुड़ने के लिए "फ़ॉर्म" को जोड़ना है, कृपया http://www.w3schools.com/tags/att_input_form.asp देखें लेकिन यह फ़ॉर्म attr नहीं है IE का समर्थन करें , अर्थात, आपको सीधे फॉर्म आईडी पास करना होगा।

Answer 7

मुझे element.attr('form')इसके बजाय उपयोग करने की आवश्यकता थी element.form।

मैं फेडोरा 12 पर फ़ायरफ़ॉक्स का उपयोग करता हूं।

Answer 8

बस के रूप में:

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

Answer 9

एक और....

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

Answer 10

एक जावास्क्रिप्ट फ़ंक्शन के इस उदाहरण को इवेंट श्रोता द्वारा फॉर्म की पहचान करने के लिए कहा जाता है

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

Answer 11

क्या यह काम करेगा? (कार्रवाई खाली छोड़ने के रूप में खुद को भी वापस प्रस्तुत, सही?)

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

"यह" चुनिंदा तत्व होगा। सुधार इसका मूल रूप होगा। सही?