কীভাবে একটি ইনপুট সমন্বিত ফর্ম পাবেন?


106

যখন আমার কাছে কেবলমাত্র সেই ইনপুটটির একটি রেফারেন্স থাকে তখন আমার কোনও ইনপুটটির ফর্ম পিতামাতার কাছে একটি রেফারেন্স পাওয়া দরকার। এটি কি জাভাস্ক্রিপ্ট দিয়ে সম্ভব? আপনি যদি চান jQuery ব্যবহার করুন।

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

এটি কাজ করে না:

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

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

উত্তর:


185

নেটিভ ডোম উপাদানগুলি যা ইনপুট রয়েছে তাদের একটি formবৈশিষ্ট্যও রয়েছে যা তারা সম্পর্কিত যে ফর্মটি নির্দেশ করে:

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

মতে W3Schools , .formইনপুট ক্ষেত্রে সম্পত্তির, ইন্টারনেট 4.0+, ফায়ারফক্স 1.0+, অপেরা 9.0+, যা আরও বেশি ব্রাউজার যে jQuery গ্যারান্টী দ্বারা সমর্থিত তাই আপনি এই লাগিয়া থাকা উচিত।

যদি এটি ভিন্ন ধরণের উপাদান (না <input>) হয়ে থাকে তবে আপনি নিকটতম পিতামাতাকে এটির সাথে খুঁজে পেতে পারেন closest:

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

এছাড়াও, এর formসম্পত্তিটিতে এই এমডিএন লিঙ্কটি দেখুন HTMLInputElement:


ঠিক আছে এই কাজ করে .. ফর্ম বৈশিষ্ট্য সম্পর্কে। আমি এটি চেষ্টা করেছি এবং এটিও কাজ করে। তবে আপনি যে ব্রাউজারগুলি বলছেন তা জুড়েই এটি সমর্থিত নয়?
রোপস্টাহ

আমি এটা নিশ্চিত। আমি ঠিক 100% নিশ্চিত নই তাই আমি কোন প্রতিশ্রুতি দিতে চাই না। আমি এখনই এটি সন্ধান করছি ...
পাওলো বার্গান্টিনো

5
এলিমেন্ট.ফর্ম ব্যবহার করুন - এটি jQuery এর চেয়ে বেশি ব্রাউজারে কাজ করবে। এটিও একটি সম্পত্তি রেফারেন্স, সুতরাং নিকটস্থ () এর সাথে ডিওএম গাছের উপরে হাঁটার চেয়ে প্রায় হাজার গুণ বেশি দক্ষ।
নিকফিটজ

1
আমি রাজী. আমি যেমন বলেছিলাম, ফর্মের সম্পত্তিটি সমস্ত সাধারণ ব্রাউজারগুলিতে বিস্তৃতভাবে প্রয়োগ করা হয়েছে কিনা তা আমি প্রাথমিকভাবে নিশ্চিত ছিলাম না। আমি আমার উত্তরটি আরও সুস্পষ্টভাবে সম্পাদনা করেছি এটি আরও ভাল বিকল্প হিসাবে তালিকাভূক্ত করার সময় আমি যদি একটি ভিন্ন ধরণের উপাদান ছিলাম তবে একটি টিডবিট হিসাবে নিকটতম রেখে যাচ্ছি।
পাওলো বার্গান্টিনো

এটি নির্বাচনের মতো অন্যান্য ইনপুট ধরণের সাথেও কাজ করে বলে মনে হচ্ছে। জানা ভাল.
ফাল্ক

42

প্রতিটি ইনপুটের একটি formসম্পত্তি থাকে যা ইনপুটটির সাথে সম্পর্কিত ফর্মটিকে নির্দেশ করে, তাই সহজভাবে:

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

4

আমি কিছুটা jQuery এবং পুরানো স্টাইলের জাভাস্ক্রিপ্ট ব্যবহার করি - কম কোড

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

এটি উপাদান যুক্ত ফর্মের একটি সম্পূর্ণ রেফারেন্স


3
আপনি মূলত বলছেন "এটিকে jQuery অবজেক্ট করুন এবং তারপরে এটিকে jQuery অবজেক্ট হিসাবে তৈরি করবেন না"।
ইশারউড

1
গিজ, শুধু করছ না কেন $(this.form)?
আন্দ্রে ফিগুয়েরেদো

3

JQuery ব্যবহার :

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

2

যদি jQuery ব্যবহার করে এবং কোনও ফর্ম উপাদানগুলির একটি হ্যান্ডেল থাকে, আপনি। Form ব্যবহার করার আগে উপাদানটি (0) পেতে হবে

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

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

এবং এইচটিএমএল-তে আপনাকে সেই উপাদানটি খুঁজে বের করতে হবে এবং সেই ফর্মের সাথে সংযোগ স্থাপনের জন্য "ফর্ম" বৈশিষ্ট্য যুক্ত করতে হবে, দয়া করে http://www.w3schools.com/tags/att_input_form.asp দেখুন তবে এই ফর্মটি অ্যাটর করে না আইই সমর্থন করুন , উদাহরণস্বরূপ, আপনাকে সরাসরি ফর্ম আইডি পাস করতে হবে।


2

আমার element.attr('form')পরিবর্তে ব্যবহার করা দরকার element.form

আমি ফেডোরা 12 এ ফায়ারফক্স ব্যবহার করি।



0

এবং আরও একটি ....

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

0

জাভাস্ক্রিপ্ট ফাংশনটির এই উদাহরণটি ফর্মটি সনাক্ত করার জন্য ইভেন্ট শ্রোতা দ্বারা ডাকা হয়েছে

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

-2

এই কাজ করবে? (অ্যাকশন ফাঁকা জমা দিয়ে নিজেই ফিরে আসে, ডান?)

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

"এটি" নির্বাচিত উপাদান হবে form রাইট?

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.