অন্য এইচটিএমএল ফর্মের মধ্যে কি এইচটিএমএল ফর্ম থাকা বৈধ?


331

নিম্নলিখিতগুলি রাখা কি বৈধ এইচটিএমএল:

<form action="a">
    <input.../>
    <form action="b">
        <input.../>
        <input.../>
        <input.../>
    </form>
    <input.../>
</form>

সুতরাং আপনি "বি" জমা দেওয়ার সময় আপনি কেবল অভ্যন্তরীণ ফর্মের মধ্যে ক্ষেত্রগুলি পাবেন। আপনি যখন "ক" জমা দিবেন আপনি "খ" এর মধ্যে থাকা সমস্ত ক্ষেত্রকে বিয়োগ করে পাবেন।

যদি এটি সম্ভব না হয় তবে এই পরিস্থিতির জন্য কোন কাজের সুযোগ উপলব্ধ?


28
আমার কাছে মনে হয় এটি আসলে একটি খুব সাধারণ প্রয়োজন যা ডিবি ইন্টারফেস থেকে পরিচিত - যদি কোনও ফর্ম আপডেট করে টেবিল এ, এবং সেই টেবিলটির একটি সারণী বি টেবিলের সাথে সংযুক্ত থাকে, আমরা প্রায়শই তার জন্য এন্ট্রি আপডেট বা তৈরি করার উপায় চাই বর্তমান ফর্মটি ছাড়াই লিঙ্কযুক্ত ক্ষেত্র। নেস্টেড সাব-ফর্মগুলি এটি করার একটি খুব স্বজ্ঞাত উপায় হবে (এবং এটি বেশ কয়েকটি ডেস্কটপ ডেটাবেস দ্বারা বাস্তবায়ন করা ইউআই)।
মনোটাস্কার

3
এটি বৈধ নয়। কর্মক্ষেত্র রয়েছে তবে আপনার এই ডেটাটি পাওয়ার জন্য অন্য কোনও পদ্ধতি ব্যবহার করা উচিত। পিএইচপি মেল স্ক্রিপ্টে সমস্ত ডেটা প্রেরণে একটি ফর্ম বিবেচনা করুন, যা তারপরে অংশটি (ক এর অংশ থেকে) একটি ইমেল হিসাবে এবং অংশ (খ থেকে অংশ) অন্য ইমেল হিসাবে জমা দেয়। অথবা একটি ডাটাবেসের মধ্যে, বা আপনি এই ডেটা দিয়ে যা কিছু করছেন। নেস্টিং ফর্মগুলি করা যেতে পারে তবে এটি উত্তর নয়!


প্রশ্নটি ভাল তবে একটি দ্রুত গুগল অনুসন্ধান (প্রদত্ত লিঙ্কগুলিতে ক্লিক না করে) প্রকাশ করে যে ফর্মগুলির মধ্যে ফর্মগুলি বৈধ কিনা। আমি ব্যক্তিগতভাবে @ অ্যান্ড্রেয়াস উত্তর পছন্দ করেছি।
জ্যারেট লয়েড

উত্তর:


380

উ: এটি বৈধ এইচটিএমএল বা এক্সএইচটিএমএল নয়

অফিসিয়াল ডাব্লু 3 সি এক্সএইচটিএমএল স্পেসিফিকেশনে, বিভাগ বি "এলিমেন্ট নিষেধাজ্ঞাগুলি" লিখেছেন যে:

"form must not contain other form elements."

http://www.w3.org/TR/xhtml1/#prohibitions

পুরানো এইচটিএমএল 3.2 স্পেস হিসাবে , ফর্মসের উপাদানটির অংশটি বলে যে:

"প্রতিটি ফর্ম অবশ্যই একটি ফর্ম উপাদানের মধ্যে আবদ্ধ থাকতে হবে a একক নথিতে বেশ কয়েকটি ফর্ম থাকতে পারে তবে ফর্ম উপাদানটি নেস্ট করা যায় না।"

বি । ওয়ার্কারআউন্ড

নীড়ের ফর্ম ট্যাগগুলির প্রয়োজন ছাড়াই জাভাস্ক্রিপ্ট ব্যবহার করে ওয়ার্কআরউন্ডস রয়েছে।

"কীভাবে নেস্টেড ফর্ম তৈরি করবেন" " (শিরোনাম সত্ত্বেও এটি ফর্ম ট্যাগগুলিতে নেস্টেড নয় , তবে একটি জাভাস্ক্রিপ্টের কার্যকারিতা)।

এই স্ট্যাক ওভারফ্লো প্রশ্নের উত্তর

দ্রষ্টব্য: যদিও কেউ ডাব্লু 3 সি ভ্যালিডেটরকে স্ক্রিপ্টিংয়ের মাধ্যমে ডিওএম চালিত করে কোনও পৃষ্ঠা পাস করার কৌশল করতে পারে তবে এটি এখনও আইনী এইচটিএমএল নয়। এই জাতীয় পদ্ধতির ব্যবহারে সমস্যাটি হ'ল ব্রাউজারগুলির মধ্যে এখন আপনার কোডের আচরণের গ্যারান্টি নেই। (যেহেতু এটি স্ট্যান্ডার্ড নয়)


4
উপরে আমার মন্তব্য দেখুন .... এটি একটি দুর্দান্ত উত্তর, দুর্দান্ত কাজ, কিন্তু একটি ভয়ঙ্কর অনুশীলন। আপনি কোনও পিএইচপি স্ক্রিপ্টে সমস্ত ডেটা জমা করে এবং সেখান থেকে ভাগ করে তাদের নিজস্ব গন্তব্যে প্রেরণে কম ঝামেলা করে ঠিক একই জিনিসটি করতে পারেন। যদিও, আপনি যে প্রশ্নের উত্তরের উত্তর দিয়েছেন, এটি কেবল একটি খারাপ এবং অর্থহীন অনুশীলন কারণ আপনি কম সময়ে সঠিক উপায়ে এটি করতে পারেন।

53

যদি কেউ এই পোস্টটি এখানে খুঁজে পান তবে জেএসের প্রয়োজনীয়তা ছাড়াই দুর্দান্ত সমাধান। আপনার সার্ভার ল্যাঙ্গুয়েজে বিভিন্ন নামের বৈশিষ্ট্যযুক্ত চেক সহ দুটি সাবমিট বাটন ব্যবহার করুন যা জমা দেওয়ার বোতামটি চাপানো হয়েছিল কারণ সেগুলির মধ্যে একটিতে কেবল সার্ভারে প্রেরণ করা হবে।

<form method="post" action="ServerFileToExecute.php">
    <input type="submit" name="save" value="Click here to save" />
    <input type="submit" name="delete" value="Click here to delete" />
</form>

আপনি যদি পিএইচপি ব্যবহার করেন তবে সার্ভার সাইডটি এ জাতীয় কিছু দেখতে পারে:

<?php
    if(isset($_POST['save']))
        echo "Stored!";
    else if(isset($_POST['delete']))
        echo "Deleted!";
    else
        echo "Action is missing!";
?>

এটি একই নয়, এই ক্ষেত্রে আপনি একই পৃষ্ঠায় যেতে চান এবং বিভিন্ন ক্রিয়া করতে চান, ২ টি ফর্মের সাহায্যে আপনি বিভিন্ন পৃষ্ঠায় যেতে পারেন এবং / অথবা প্রতিটি ক্ষেত্রে বিভিন্ন তথ্য প্রেরণ করতে পারেন।
লুইস টেললেজ

আপনি একটি পিএইচপি ফাইলটি মোড়ক হিসাবে ব্যবহার করতে পারেন এবং যে কোনও ফাইল আপনি চাইলে অন্তর্ভুক্ত করতে পারেন যদি আপনি বিভিন্ন ফাইলগুলিতে কোড চান। সুতরাং (প্রতিধ্বনি "সঞ্চিত!";) এর পরিবর্তে আপনি লিখতে পারতেন ("a.php" অন্তর্ভুক্ত;)
Andreas

আমার রুপে একাধিক মুছুন বোতাম রয়েছে (যে কারণে আমি এখানে নেস্টেড ফর্ম বিবেচনা করে আসছি) প্রতিটি রেকর্ডের জন্য 1 এবং একটি বাল্ক মোছার জন্য প্রতিটিটির একটি তালিকা চেকবক্স রয়েছে। আপনার প্রতিক্রিয়া আমাকে এখনই আমার পরিকল্পনার পুনর্বিবেচনা করতে উত্সাহিত করেছে আমি স্বতন্ত্র মুছার জন্য বোতামগুলির একটি সংখ্যাসূচক আইডি দিয়ে নামকরণ করা উচিত এবং এতে প্রচুর পরিমাণে মুছুন। IL make পিএইচপি করুন বাছাই।
ক্রিস

@ আন্দ্রেয়াস অর্থের উপর রয়েছে। ফর্ম ইনপুট কীভাবে ব্যাখ্যা করা হয় তার পরিবর্তনের জন্য এটি প্রাকৃতিক সমাধান। আপনি যদি পোস্ট / রিডাইরেক্ট / গেট ব্যবহার করেন তবে গন্তব্যটিও পরিবর্তিত হতে পারে। তবে, যদি আপনার ক্রিয়াকে একক 'আওরব' শেষ পয়েন্টের সাথে সংযুক্ত করার জন্য সার্ভারে আপনার নমনীয়তা না থাকে তবে আমি মনে করি আপনি হ্যাকের সাথে আটকে আছেন যা আমি ভীত।

27

এইচটিএমএল x.x এবং এইচটিএমএল 5 নেস্টেড ফর্মগুলি মঞ্জুরি দেয় না, তবে এইচটিএমএল 5 "ফর্ম" বৈশিষ্ট্য ("ফর্মের মালিক") সহ একটি কাজের সুযোগ দেয়।

এইচটিএমএল 4.x হিসাবে আপনি করতে পারেন:

  1. কেবলমাত্র লুকানো ক্ষেত্র এবং জাভাস্ক্রিপ্ট সহ এর ইনপুট সেট করতে এবং ফর্মটি জমা দিতে একটি অতিরিক্ত ফর্ম (গুলি) ব্যবহার করুন।
  2. একক সত্তার মতো দেখতে বেশ কয়েকটি এইচটিএমএল ফর্ম লাইন করতে CSS ব্যবহার করুন - তবে আমি মনে করি এটি খুব শক্ত hard

1
কেন এটি নিচে ভোট হয়েছে তা নিশ্চিত নয় Not ফর্মের মালিকদের ডাব্লু
SooDesuNe

5
@SooDesuNe আপনার লিঙ্ক তারিখ সীমার বাইরে, এখানে নতুন এক w3.org/TR/html5/forms.html#form-owner
chiliNUT

13

অন্যরা যেমন বলেছে, এটি বৈধ HTML নয়।

দেখে মনে হচ্ছে আপনি একে একে একে একে একে একে একে একে একে একে একে একে একে একে একে একে অপরের মধ্যে দৃশ্যমান করার জন্য করেছেন। যদি এটি হয় তবে কেবল দুটি পৃথক ফর্ম করুন এবং সেগুলি স্থাপনের জন্য সিএসএস ব্যবহার করুন।


1
এটি আমি ভাবছিলাম যে আমার ওয়েবসাইটের জন্য আমার প্রয়োজন হবে তবে কীভাবে এটি করা যায় তার একটি উদাহরণ পছন্দ করি।
ব্রায়ান পিটারসন

8

না, এইচটিএমএল স্পেসিফিকেশন বলে যে কোনও FORMউপাদানটিতে অন্য FORMউপাদান থাকা উচিত নয় ।


5

আপনি ডাব্লু 3 ভ্যালিডেটরে HTML কোড ইনপুট করে খুব সহজেই নিজের প্রশ্নের উত্তর দিতে পারেন । (এটিতে একটি পাঠ্য ইনপুট ক্ষেত্র বৈশিষ্ট্যযুক্ত, আপনি এমনকি আপনার কোডটি একটি সার্ভারে রাখতে হবে না ...)

(এবং না, এটি বৈধ হবে না।)


5

বরং ফর্মটির ক্রিয়া বৈশিষ্ট্যের ভিতরে একটি কাস্টম জাভাস্ক্রিপ্ট-পদ্ধতি ব্যবহার করুন!

যেমন

<html>
    <head>
        <script language="javascript" type="text/javascript">
        var input1 = null;
        var input2 = null;
        function InitInputs() {
            if (input1 == null) {
                input1 = document.getElementById("input1");
            }
            if (input2 == null) {
                input2 = document.getElementById("input2");
            }

            if (input1 == null) {
                alert("input1 missing");
            }
            if (input2 == null) {
                alert("input2 missing");
            }
        }
        function myMethod1() {
            InitInputs();
            alert(input1.value + " " + input2.value);
        }
        function myMethod2() {
            InitInputs();
            alert(input1.value);
        }
        </script>
    </head>
    <body>
        <form action="javascript:myMethod1();">
            <input id="input1" type="text" />
            <input id="input2" type="text" />
            <input type="button" onclick="myMethod2()" value="myMethod2"/>
            <input type="submit" value="myMethod1" />
        </form>
    </body>
</html>

5

বাইরের ফর্মের ভিতরে একটি আইফ্রেম থাকার সম্ভাবনা রয়েছে। Iframe এর অভ্যন্তরীণ ফর্ম ধারণ করে। <base target="_parent" />ফর্মটি প্রধান পৃষ্ঠার অংশ হিসাবে আচরণ করতে ইফ্রামের হেড ট্যাগের ভিতরে থাকা ট্যাগটি ব্যবহার করার বিষয়টি নিশ্চিত করুন ।



1

না, এটি বৈধ নয়। তবে একটি "সমাধান" ফর্ম "এ" এর বাইরে "বি" ফর্মের বাইরে একটি মডেল উইন্ডো তৈরি করতে পারে।

<div id="myModalFormB" class="modal">
    <form action="b">
        <input.../>
        <input.../>
        <input.../>
        <button type="submit">Save</button>
    </form>
</div>

<form action="a">
    <input.../>
    <a href="#myModalFormB">Open modal b </a>
    <input.../>
</form>

আপনি যদি বুটস্ট্র্যাপ ব্যবহার করছেন বা সিএসএস মেটেরাইজ করছেন তবে এটি সহজেই করা যায়। আমি iframe ব্যবহার এড়ানোর জন্য এটি করছি।


0

নেস্টিং ফর্ম ট্যাগগুলির জন্য একটি জাভাস্ক্রিপ্ট নন:

কারণ আপনি অনুমতি দিন

সমস্ত ক্ষেত্র বি "বি" এর মধ্যে বিয়োগ করে।

"একটি" জমা দেওয়ার সময়, নিম্নলিখিত অভিনব জাভাস্ক্রিপ্ট কৌশলগুলি ছাড়াই নিয়মিত ওয়েব-ফর্মগুলি ব্যবহার করে কাজ করবে:

পদক্ষেপ 1. প্রতিটি ফর্ম তার নিজস্ব ওয়েব পৃষ্ঠায় রাখুন।

পদক্ষেপ ২ আপনি এই উপ-ফর্মটি যেখানে প্রদর্শিত চান সেখানে একটি আইফ্রেমে .োকান।

পদক্ষেপ 3. লাভ।

একটি ডেমো দেখানোর জন্য আমি একটি কোড-প্লেগ্রাউন্ড ওয়েবসাইট ব্যবহার করার চেষ্টা করেছি, তবে তাদের মধ্যে অনেকেই তাদের ওয়েবসাইটগুলি আইফ্রেমে এম্বেড করা নিষিদ্ধ করে এমনকি তাদের নিজস্ব ডোমেনের মধ্যেও।


-1

যদি আপনার 1: এম রিলেশনাল ডাটাবেসে ডেটা জমা / কমিট করার জন্য আপনার ফর্মের প্রয়োজন হয় তবে আমি টেবিল এ তে "ইনসার্ট" পরে ডিবি ট্রিগার তৈরি করার পরামর্শ দেব যা টেবিল বিয়ের জন্য প্রয়োজনীয় ডেটা sertোকাবে will


-2

না, এটি বৈধ নয় তবে আপনি HTMLসাহায্যের CSSএবং jQueryব্যবহারের সাহায্যে নিজের অভ্যন্তরীণ ফর্মের অবস্থানটি চালিত করতে পারেন । প্রথমে আপনার পিতামাতার ফর্মের ভিতরে এবং তারপরে পৃষ্ঠার অন্য কোনও স্থানে আপনার সন্তানের (অভ্যন্তরীণ) ফর্মের সাথে কিছু ধারক ডিভ তৈরি করুন:

<form action="a">
    <input.../>
    <div class="row" id="other_form_container"></div>
    <input.../>
</form>

....

<div class="row" id="other_form">
    <form action="b">
        <input.../>
        <input.../>
        <input.../>
    </form>
</div>

আপনার ধারক ডিভকে কিছু স্থিতিশীল হেগ্ট দিন

<style>
  #other_form_container {
    height:90px;
    position:relative;
  }
</style> 

কন্টেইনার ডিভের তুলনায় তুলনামূলকভাবে "অন্যান্য_ফর্ম" অবস্থানটি ধন্যবাদ Thank

<script>
  $(document).ready(function() {
    var pos = $("#other_form_container").position();
    $("#other_form").css({
      position: "absolute",
      top: pos.top - 40,
      left: pos.left + 7,
      width: 500,
    }).show();
  });
</script>

পিএস: এটিকে সুন্দর দেখানোর জন্য আপনাকে সংখ্যার সাথে খেলতে হবে।

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