HTML ফর্ম অ্যাকশন অ্যাট্রিবিউট আয়ত্ত করা:একটি ধাপে ধাপে গাইড

এইচটিএমএল ফর্ম অ্যাকশন অ্যাট্রিবিউট সংজ্ঞায়িত করে যে যখন একটি ওয়েব পৃষ্ঠায় একটি ফর্ম জমা দেওয়া হয় তখন ডেটার কী হবে৷ অ্যাকশন অ্যাট্রিবিউটের মান ওয়েব রিসোর্সের URL হওয়া উচিত যা ফর্মের বিষয়বস্তু প্রক্রিয়া করবে।

ফর্ম তৈরি করার সময় এবং আপনার সাইট বা ওয়েব অ্যাপ্লিকেশনে ডেটা জিজ্ঞাসা করার সময়, আপনি প্রায়শই আপনার ডেটা দিয়ে কিছু করতে চান, তাই না? এখানে ফর্ম অ্যাকশন অ্যাট্রিবিউটটি কার্যকর হয়৷

৷

HTML এ একটি ফর্ম তৈরি করার প্রাথমিক বিষয়গুলো আপনার জানা উচিত। আপনি মূলত আপনার ফর্ম বিষয়বস্তু

উপাদানে মোড়ানো। ওপেনিং ট্যাগে আমরা ব্যবহার করতে পারি এমন কয়েকটি অ্যাট্রিবিউট রয়েছে এবং তার মধ্যে একটি হল অ্যাকশন।

ফর্ম জমা দেওয়ার সময় আমরা ফর্ম ডেটা কোথায় পাঠাতে চাই তা নির্দিষ্ট করতে অ্যাকশন অ্যাট্রিবিউট ব্যবহার করা হয়। সুতরাং কর্মের মান হল সেই পৃষ্ঠা যা ফর্মটি প্রক্রিয়া করবে।

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

চলুন অ্যাকশন অ্যাট্রিবিউটের সিনট্যাক্স দেখে নেওয়া যাক:

<form action="/submit.php">
 
</form>

কর্ম বৈশিষ্ট্য আমাদের খোলার ট্যাগের মধ্যে উপস্থিত হয়। এই অ্যাট্রিবিউটটি প্রায়ই মেথড অ্যাট্রিবিউটের সাথে ব্যবহার করা হয়।

ডিফল্টরূপে, মেথড অ্যাট্রিবিউট "পেতে" সেট করা থাকে। এর মানে হল যে আপনার ফর্মটি জমা দেওয়ার সময় একটি HTTP GET অনুরোধের মাধ্যমে ডেটা পাঠাবে৷ আপনি আপনার খোলার ট্যাগে “method=’post'” উল্লেখ করে পদ্ধতি পরিবর্তন করতে পারেন।

যখন একটি জমা বোতামে ক্লিক করা হয় তখন একটি ফর্ম থেকে ডেটা "অ্যাকশন" URL এ পাঠানো হয়।

ফর্ম অ্যাকশন HTML উদাহরণ

আসুন একটি উদাহরণ দেখি:

<form action="process.html" method="get">
 <label for="username">User</label>
 <input type="text" id="username" name="username"><br><br>
 <label for="email">Email</label>
 <input type="email" id="email" name="email"><br><br>
 <input type="submit" value="Submit">
</form>

উপরে, ক্রিয়াটি process.html নামে একটি পৃষ্ঠায় ব্যবহারকারীর নাম এবং ইমেল ডেটা প্রেরণ করছে। ব্যবহারকারীর নাম এবং ইমেল ডেটাতে ইনপুট টাইপ "টেক্সট" রয়েছে। আমরা ইনপুট টাইপ "জমা দিন" সহ একটি বোতাম সংজ্ঞায়িত করি। ক্লিক করা হলে, এই বোতামটি আমাদের ডেটা আমাদের "অ্যাকশন" URL এ পাঠাবে৷

৷

এখন একটি প্রকৃত HTML ফাইলে উপরের ফর্মের উদাহরণে প্লাগ ইন করুন। তারপর একই ফোল্ডারে process.html নামে আরেকটি ফাইল তৈরি করুন। এই ফাইলটিতে নিম্নলিখিত বিষয়বস্তু থাকা উচিত:

<html>
 <head>
 <meta charset="UTF-8">
 <title>Process</title>
 </head>
 <body>This is the destination process page</body>
</html>

এই কোডটি একটি সাধারণ ওয়েব পৃষ্ঠাকে সংজ্ঞায়িত করে যা পৃষ্ঠাটি লোড করার সময় পাঠ্যের একটি অনুচ্ছেদ দেখায়। আসুন আমাদের ওয়েব ফর্মে ফিরে যাই যা আমরা আগে সংজ্ঞায়িত করেছি এবং এটি পূরণ করুন:

HTML ফর্ম অ্যাকশন অ্যাট্রিবিউট আয়ত্ত করা:একটি ধাপে ধাপে গাইড

এখন সাবমিট এ ক্লিক করুন। লক্ষ্য করুন আমরা স্বয়ংক্রিয়ভাবে process.html পৃষ্ঠায় নিয়ে গিয়েছিলাম! তারপর, আপনি কি ইউআরএল বার লক্ষ্য করেছেন, যে সমস্ত অতিরিক্ত ডেটা কি? "?" এর পরে ডেটা চিহ্ন হল ক্যোয়ারী প্যারামিটার, এবং যেহেতু আমরা অনুরোধটিকে GET হিসেবে উল্লেখ করেছি, তাই ডেটা ক্যোয়ারী প্যারামিটার হিসেবে পাস করা হচ্ছে।

এই উদাহরণ দিয়ে আপনি মনে করতে পারেন এটি খুব দরকারী নয়। এটাই সত্য। সাধারণত অ্যাকশন অ্যাট্রিবিউট সার্ভার পৃষ্ঠাগুলিতে ফর্ম বিষয়বস্তু পাঠাতে ব্যবহৃত হয়। উদাহরণস্বরূপ, আমরা process.php.

নামে একটি পিএইচপি ফাইল ব্যবহার করতে পারি

এই process.php তারপর ডাটা দিয়ে সব ম্যাজিক করবে। এই পৃষ্ঠাটি একটি ডাটাবেসে আমাদের ডেটা সংরক্ষণ করতে পারে, বা আপনার প্রিয় ইভেন্টে আপনাকে নিবন্ধন করতে পারে, আপনি এটির নাম দিন। পিএইচপি একটি শক্তিশালী সার্ভার স্ক্রিপ্টিং ভাষা, যা প্রায়ই ওয়েব ডেভেলপমেন্টে ব্যবহৃত হয়। আপনি যদি কখনও ওয়ার্ডপ্রেস ব্যবহার করে থাকেন, সম্ভবত যে ডেটা প্রক্রিয়া করা হচ্ছে তা PHP-এর মাধ্যমে করা হয়েছে৷

৷

পিএইচপি সম্পর্কে আরও জানতে, আমাদের পিএইচপি গাইড কীভাবে শিখবেন তা দেখুন।

অ্যাকশন অ্যাট্রিবিউট কি প্রয়োজন?

HTML4 তে ফিরে, উত্তরটি হ্যাঁ হবে। আজকাল HTML5 এর সাথে, আপনাকে একটি অ্যাকশন অ্যাট্রিবিউট নির্দিষ্ট করতে হবে না। যদি আপনার কাছে একটি ক্রিয়া বৈশিষ্ট্য ছাড়া একটি ফর্ম ট্যাগ থাকে তবে ডেটা তার নিজস্ব পৃষ্ঠায় পাঠানো হবে৷

৷

কেন আমরা এটা করব? একক পৃষ্ঠা অ্যাপ্লিকেশন (SPA) এর জন্মের সাথে, আমরা জাভাস্ক্রিপ্ট ব্যবহার করে আমাদের ফর্ম ডেটা প্রক্রিয়া করতে চাই। অথবা আমরা অন্য ফ্রেমওয়ার্ক ব্যবহার করে আমাদের ডেটা প্রক্রিয়া করতে চাই যেমন প্রতিক্রিয়া / কৌণিক।

যদি আমরা ভ্যানিলা জাভাস্ক্রিপ্ট ব্যবহার করি তাহলে আমরা প্রায়ই ফর্ম জমা দেওয়ার সময় একটি জাভাস্ক্রিপ্ট ইভেন্ট লিসেনার যোগ করে এটি করি।

উপসংহার

এইচটিএমএল ফর্ম অ্যাকশন অ্যাট্রিবিউট ফর্ম জমা দেওয়ার সময় ফর্মের বিষয়বস্তুর কী হবে তা সংজ্ঞায়িত করে। অ্যাকশন অ্যাট্রিবিউট একটি ইউআরএলকে আর্গুমেন্ট হিসেবে গ্রহণ করে।

আপনি কি ওয়েব ডেভেলপার হতে আগ্রহী? আমাদের সম্পূর্ণ কিভাবে HTML গাইড শিখতে হয় তা দেখুন। আপনি HTML শেখার বিষয়ে বিশেষজ্ঞের পরামর্শের পাশাপাশি শীর্ষ অনলাইন কোর্স এবং শেখার সংস্থানগুলির একটি তালিকা পাবেন৷