কম্পিউটার টিউটোরিয়াল

HTML ফর্ম কী এবং কীভাবে ব্যবহার করবেন?


HTML ফর্ম দরকার হয় সাইট ভিজিটর থেকে কিছু ডেটা সংগ্রহ করার জন্য। উদাহরণস্বরূপ, একটি ছাত্রের তথ্য যেমন নাম, বয়স, ঠিকানা, নম্বর ইত্যাদি সংগ্রহ করা, যখন সে কলেজের ওয়েবসাইটে রেজিস্ট্রেশন করছে।

একটি ফর্ম সাইট ভিজিটর থেকে ইনপুট নেয় এবং সেটিকে একটি ব্যাক-এন্ড অ্যাপ্লিকেশনে পোস্ট করে যেমন CGI, ASP Script বা PHP স্ক্রিপ্ট ইত্যাদি। ব্যাক-এন্ড অ্যাপ্লিকেশন পাস করা ডেটার উপর প্রয়োজনীয় প্রসেসিং করে অ্যাপ্লিকেশনের ভিতরে সংজ্ঞায়িত বিজনেস লজিক অনুযায়ী।

HTML <form> ট্যাগ HTML-এ ফর্ম তৈরি করতে ব্যবহৃত হয়।

HTML ফর্ম কী এবং কীভাবে ব্যবহার করবেন?

উপরে দেখানো অনুযায়ী, আমরা কিছু অ্যাট্রিবিউট ব্যবহার করেছি। এখানে ফর্মের অ্যাট্রিবিউটগুলো:

HTML ফর্ম অ্যাট্রিবিউট

HTML ফর্মের অ্যাট্রিবিউটগুলো হল:

S.Noঅ্যাট্রিবিউট ও বিবরণ
1Action আপনার পাস করা ডেটা প্রসেস করার জন্য तैयार ব্যাক-এন্ড স্ক্রিপ্ট।
2Method ডেটা আপলোড করার জন্য 사용할 মেথড। সবচেয়ে বেশি ব্যবহৃত হল GET এবং POST মেথড।
3Target স্ক্রিপ্টের ফলাফল কোন টার্গেট উইন্ডো বা ফ্রেমে প্রদর্শিত হবে তা নির্দিষ্ট করুন। এটি _blank, _self, _parent ইত্যাদি মান নেয়।
4Enctype ব্রাউজার ডেটা সার্ভারে পাঠানোর আগে কীভাবে এনকোড করবে তা নির্দিষ্ট করতে enctype অ্যাট্রিবিউট ব্যবহার করতে পারেন। সম্ভাব্য মানগুলো:
application/x-www-form-urlencoded − এটি সরল পরিস্থিতিতে অধিকাংশ ফর্মে ব্যবহৃত স্ট্যান্ডার্ড মেথড।
multipart/form-data − এটি ব্যবহার করা হয় যখন আপনি বাইনারি ডেটা ফাইল হিসেবে আপলোড করতে চান যেমন ইমেজ, ওয়ার্ড ফাইল ইত্যাদি।


HTML ফর্ম কন্ট্রোল

ডেটা সংগ্রহের জন্য বিভিন্ন ধরণের ফর্ম কন্ট্রোল উপলব্ধ যেমন টেক্সট ইনপুট, চেকবক্স, রেডিও বক্স, ফাইল সিলেক্ট বক্স, সাবমিট বাটন, ইত্যাদি।

চলুন একটি সিম্পল উদাহরণ দেখি <input> ট্যাগ ব্যবহার করে HTML ফর্মে ব্যবহারকারীর ইনপুট নেওয়ার:

উদাহরণ

<!DOCTYPE html> <html>    <head>       <title>HTML Forms</title>    </head>    <body>       <form>          Student Name: <input type = "text" name = "sname" /><br>          Student Subject: <input type = "text" name = "ssubject" />       </form>    </body> </html>

উপরের কোড দিয়ে নাম এবং বিষয়ের জন্য ব্যবহারকারীর ইনপুট পেতে পারেন।

আমরা উপরে অ্যাট্রিবিউট type এবং name ব্যবহার করেছি। চলুন <input> ট্যাগের অন্যান্য সব অ্যাট্রিবিউট দেখি:

Sr.Noঅ্যাট্রিবিউট ও বিবরণ
1type ইনপুট কন্ট্রোলের ধরন নির্দেশ করে এবং টেক্সট ইনপুট কন্ট্রোলের জন্য এটি text-এ সেট থাকে।
2name কন্ট্রোলের নাম দেওয়া হয় যাতে সার্ভারে পাঠানো হয় এবং সেটি চেনা যায় এবং মান পাওয়া যায়।
3value কন্ট্রোলের ভিতরে প্রাথমিক মান দিতে এটি ব্যবহার করা যেতে পারে।
4size টেক্সট-ইনপুট কন্ট্রোলের প্রস্থ ক্যারেক্টার সংখ্যা অনুযায়ী নির্দিষ্ট করতে দেয়।
5maxlength
একটি টেক্সট বক্সে ব্যবহারকারী সর্বোচ্চ কতগুলো ক্যারেক্টার লিখতে পারবে তা নির্দিষ্ট করে।

  1. DNS লিক কী এবং কীভাবে সেটি ফিক্স করবেন

  2. Google Maps Plus Codes আবিষ্কার করুন: বিশ্বের যেকোনো জায়গা খুঁজে বের করার সহজ গাইড

  3. গুগল অ্যাসিস্ট্যান্ট রুটিন মাস্টার করুন: দ্রুত সেট আপ করার গাইড

  4. সিস্টেম ইন্টারনালস: উইন্ডোজ প্রশাসনের জন্য শক্তিশালী টুলস