HTML ফর্ম হলো একটি ইন্টারেকটিভ উপাদান যা ব্যবহারকারীকে ডেটা ইনপুট করার সুযোগ দেয়। এই ডেটা সাধারণত সার্ভারে পাঠানো হয় প্রক্রিয়াকরণের জন্য। ফর্মের মাধ্যমে আমরা বিভিন্ন ধরনের ইনপুট যেমন টেক্সট, ইমেল, পাসওয়ার্ড, রেডিও বাটন, চেকবক্স ইত্যাদি গ্রহণ করতে পারি।
HTML ফর্ম তৈরির জন্য মূলত <form> ট্যাগ ব্যবহার করা হয়। ফর্মের বিভিন্ন ইনপুট এলিমেন্টগুলো <form> ট্যাগের মধ্যে রাখা হয়।
<form action="url" method="method">
<!-- ইনপুট ফিল্ড -->
</form>
action: এই অ্যাট্রিবিউটটি নির্দেশ করে ডেটা কোথায় (URL) পাঠানো হবে।method: ডেটা পাঠানোর পদ্ধতি নির্ধারণ করে। সাধারণত GET বা POST পদ্ধতি ব্যবহৃত হয়।
<form action="/submit" method="post">
<label for="name">নাম:</label>
<input type="text" id="name" name="name" placeholder="আপনার নাম লিখুন">
<button type="submit">সাবমিট</button>
</form>
type="text": এটি সাধারণ টেক্সট ইনপুটের জন্য ব্যবহৃত হয়।placeholder: ইনপুট ফিল্ডে নির্দেশনা প্রদর্শনের জন্য।
<label for="password">পাসওয়ার্ড:</label>
<input type="password" id="password" name="password">
type="password": এটি ইনপুটের ক্ষেত্রে অক্ষরগুলো লুকিয়ে রাখে।
<label for="email">ইমেইল:</label>
<input type="email" id="email" name="email" placeholder="example@example.com">
type="email": ইমেল এড্রেস ইনপুটের জন্য। এটি ডেটার বৈধতা যাচাই করে।
<label>
<input type="checkbox" name="agree" value="yes">
শর্তাবলী মেনে নিন
</label>
type="checkbox": এক বা একাধিক অপশন সিলেক্ট করার জন্য।
<label>
<input type="radio" name="gender" value="male"> পুরুষ
</label>
<label>
<input type="radio" name="gender" value="female"> মহিলা
</label>
type="radio": একাধিক অপশনের মধ্যে শুধুমাত্র একটি নির্বাচন করতে।
<button type="submit">সাবমিট</button>
<button type="reset">রিসেট</button>
type="reset": এটি ইনপুট ফিল্ডগুলো রিসেট করে ডিফল্ট মানে ফিরিয়ে নেয়।
<label for="country">দেশ:</label>
<select id="country" name="country">
<option value="bd">বাংলাদেশ</option>
<option value="in">ভারত</option>
<option value="pk">পাকিস্তান</option>
</select>
<select>: ড্রপডাউন তৈরি করতে ব্যবহৃত হয়।<option>: প্রতিটি অপশন উপস্থাপন করে।
<label for="message">মেসেজ:</label>
<textarea id="message" name="message" rows="4" cols="50"></textarea>
<textarea>: বড় পরিমাণ টেক্সট ইনপুটের জন্য ব্যবহৃত হয়।
<form action="/submit-form" method="post">
<label for="username">ইউজারনেম:</label>
<input type="text" id="username" name="username">
<label for="email">ইমেইল:</label>
<input type="email" id="email" name="email">
<label for="password">পাসওয়ার্ড:</label>
<input type="password" id="password" name="password">
<label>
<input type="checkbox" name="newsletter" value="subscribe">
নিউজলেটার সাবস্ক্রাইব করুন
</label>
<button type="submit">সাবমিট</button>
</form>
HTML ফর্ম ব্যবহারকারীর ডেটা সংগ্রহ করার একটি গুরুত্বপূর্ণ উপাদান। এটি বিভিন্ন ধরনের ইনপুট উপাদান প্রদান করে যা ব্যবহারকারীর ইন্টারেকশন সহজ এবং কার্যকর করে। ফর্ম ডিজাইনের সময় যথাযথ অ্যাট্রিবিউট এবং ট্যাগ ব্যবহার নিশ্চিত করা প্রয়োজন।
HTML ফর্ম হলো একটি ইন্টারেকটিভ উপাদান যা ব্যবহারকারীকে ডেটা ইনপুট করার সুযোগ দেয়। এই ডেটা সাধারণত সার্ভারে পাঠানো হয় প্রক্রিয়াকরণের জন্য। ফর্মের মাধ্যমে আমরা বিভিন্ন ধরনের ইনপুট যেমন টেক্সট, ইমেল, পাসওয়ার্ড, রেডিও বাটন, চেকবক্স ইত্যাদি গ্রহণ করতে পারি।
HTML ফর্ম তৈরির জন্য মূলত <form> ট্যাগ ব্যবহার করা হয়। ফর্মের বিভিন্ন ইনপুট এলিমেন্টগুলো <form> ট্যাগের মধ্যে রাখা হয়।
<form action="url" method="method">
<!-- ইনপুট ফিল্ড -->
</form>
action: এই অ্যাট্রিবিউটটি নির্দেশ করে ডেটা কোথায় (URL) পাঠানো হবে।method: ডেটা পাঠানোর পদ্ধতি নির্ধারণ করে। সাধারণত GET বা POST পদ্ধতি ব্যবহৃত হয়।
<form action="/submit" method="post">
<label for="name">নাম:</label>
<input type="text" id="name" name="name" placeholder="আপনার নাম লিখুন">
<button type="submit">সাবমিট</button>
</form>
type="text": এটি সাধারণ টেক্সট ইনপুটের জন্য ব্যবহৃত হয়।placeholder: ইনপুট ফিল্ডে নির্দেশনা প্রদর্শনের জন্য।
<label for="password">পাসওয়ার্ড:</label>
<input type="password" id="password" name="password">
type="password": এটি ইনপুটের ক্ষেত্রে অক্ষরগুলো লুকিয়ে রাখে।
<label for="email">ইমেইল:</label>
<input type="email" id="email" name="email" placeholder="example@example.com">
type="email": ইমেল এড্রেস ইনপুটের জন্য। এটি ডেটার বৈধতা যাচাই করে।
<label>
<input type="checkbox" name="agree" value="yes">
শর্তাবলী মেনে নিন
</label>
type="checkbox": এক বা একাধিক অপশন সিলেক্ট করার জন্য।
<label>
<input type="radio" name="gender" value="male"> পুরুষ
</label>
<label>
<input type="radio" name="gender" value="female"> মহিলা
</label>
type="radio": একাধিক অপশনের মধ্যে শুধুমাত্র একটি নির্বাচন করতে।
<button type="submit">সাবমিট</button>
<button type="reset">রিসেট</button>
type="reset": এটি ইনপুট ফিল্ডগুলো রিসেট করে ডিফল্ট মানে ফিরিয়ে নেয়।
<label for="country">দেশ:</label>
<select id="country" name="country">
<option value="bd">বাংলাদেশ</option>
<option value="in">ভারত</option>
<option value="pk">পাকিস্তান</option>
</select>
<select>: ড্রপডাউন তৈরি করতে ব্যবহৃত হয়।<option>: প্রতিটি অপশন উপস্থাপন করে।
<label for="message">মেসেজ:</label>
<textarea id="message" name="message" rows="4" cols="50"></textarea>
<textarea>: বড় পরিমাণ টেক্সট ইনপুটের জন্য ব্যবহৃত হয়।
<form action="/submit-form" method="post">
<label for="username">ইউজারনেম:</label>
<input type="text" id="username" name="username">
<label for="email">ইমেইল:</label>
<input type="email" id="email" name="email">
<label for="password">পাসওয়ার্ড:</label>
<input type="password" id="password" name="password">
<label>
<input type="checkbox" name="newsletter" value="subscribe">
নিউজলেটার সাবস্ক্রাইব করুন
</label>
<button type="submit">সাবমিট</button>
</form>
HTML ফর্ম ব্যবহারকারীর ডেটা সংগ্রহ করার একটি গুরুত্বপূর্ণ উপাদান। এটি বিভিন্ন ধরনের ইনপুট উপাদান প্রদান করে যা ব্যবহারকারীর ইন্টারেকশন সহজ এবং কার্যকর করে। ফর্ম ডিজাইনের সময় যথাযথ অ্যাট্রিবিউট এবং ট্যাগ ব্যবহার নিশ্চিত করা প্রয়োজন।
আপনি আমাকে যেকোনো প্রশ্ন করতে পারেন, যেমনঃ
Are you sure to start over?