HTML DOM Input Button form প্রপার্টি

HTML DOM Input Button form প্রপার্টি একটি ইনপুট বাটনটি কোন ফর্ম এলিমেন্টের (<form>) ভেতরে অবস্থিত সেটির রেফারেন্স রিটার্ন করে। এটি শুধু পঠনযোগ্য (read-only)।

সিনট্যাক্স

object.form

উদাহরণ: বাটনটি কোন ফর্মের অংশ তা শনাক্ত করা

<!DOCTYPE html>
<html>
<head>
    <title>HTML DOM form Property</title>
    <style>
        body { text-align: center; }
        .btn {
            display: block; margin: 1rem auto;
            background-color: #db133a; color: #fff;
            border: 1px solid #db133a; padding: 0.5rem;
            border-radius: 50px; width: 20%;
        }
        .show-message { font-weight: bold; font-size: 1.4rem; color: #ffc107; }
    </style>
</head>
<body>
    <h1>form Property Example</h1>

    <form id="form1">
        <fieldset>
            <legend>Form 1</legend>
            <input type="button" class="btn" value="button 1">
            <input type="button" class="btn" value="button 2">
        </fieldset>
    </form>

    <form id="form2">
        <fieldset>
            <legend>Form 2</legend>
            <input type="button" class="btn" value="button 1">
            <input type="button" class="btn" value="button 2">
        </fieldset>
    </form>

    <div class="show-message"></div>

    <script>
        var btnArr = document.querySelectorAll(".btn");
        var showMessage = document.querySelector(".show-message");

        btnArr.forEach(function(ele) {
            ele.addEventListener("click", function(e) {
                showMessage.innerHTML = "";
                if (e.target.form.id === 'form1') {
                    showMessage.innerHTML = "I'm from form 1";
                } else {
                    showMessage.innerHTML = "I'm from form 2";
                }
            });
        });
    </script>
</body>
</html>

আউটপুট

• Form 1-এর যেকোনো বাটনে ক্লিক করলে দেখাবে: "I'm from form 1"
• Form 2-এর যেকোনো বাটনে ক্লিক করলে দেখাবে: "I'm from form 2"

ব্যবহারিক ক্ষেত্র

• একই পেজে একাধিক ফর্ম থাকলে, ইভেন্ট হ্যান্ডলারের ভিতর থেকে বাটনটি কোন ফর্মেরgehörig তা জানার জন্য।
• ফর্ম সাবমিশন বা ভ্যালিডেশন লজিকে ফর্ম রেফারেন্স পাওয়ার জন্য।
• button.form.submit() দিয়ে প্রোগ্রাম্যাটিক্যালি ফর্ম সাবমিট করা যায়।