HTML form User দের তথ্য ইনপুটের জন্য ব্যবহৃত হয়। ফরম হচ্ছে এমন একটি এলাকা যেখানে ফরম এর উপাদান ধারণ করে। ফরম উপাদান – ইউজারের প্রদানকৃত তথ্য (লেখা, ছবি, ড্রপডাউন মেনু, বিভিন্ন বাটন) একটি ফরম দিয়ে প্রকাশ করা হয়। HTML ফরম এর অনেক form tag রয়েছে ।
তার মধ্যে input tag টি বহুল ব্যবহৃত। বিভিন্ন রকম Input সমূহ Attribute দ্বারা নির্দিষ্ট করা থাকে। যেমন:
Input Field: এই ফিল্ডটি যখন ইউজার কোন নম্বর বা লেখা Field এ input করে তখন ব্যবহার করা হয়।
Input Type: Input type এর উপরের নির্ভর করে ইউজার এর কোন ডাটা কিভাবে প্রদর্শন করবে। Input type অ্যাট্রিবিউট যদি type=”text” হয় তাহলে ইউজার এর ইনপুটকৃত তথ্য টেক্সট হিসেবে ব্রাউজার এ প্রদর্শন করবে। আর Input type অ্যাট্রিবিউট যদি type=” password” হয় তাহলে ইউজার এর ইনপুটকৃত তথ্য পাসওয়ার্ড(******) হিসেবে হিডেন দেখাবে। নিচের Input ট্যাগ এর উদাহরণ দুটি দেখুন:
Text Field:
<html>
<body>
<form action=” ”>
First Name: <input type =”text” name=”first_name”>
<br>
Last name: <input type =”text” name=”last_name”>
</from>
</body>
</html>
Note: উপরের ফর্মে আমরা ২টি Input ফিল্ড নিয়েছি। ১. First Name: ২. Last Name: এবং এদের Input “type” অ্যাট্রিবিউট নিয়েছি type=”text”। এই ”text” অ্যাট্রিবিউট এর কারণে আপনার উপরের ফর্মের থেকে ২টি Input টেক্সট ফিল্ড পাবো।
Password Field:
<html>
<body>
<form action=” ”>
User name:
<input type=”text” name=”user” />
<br>
Password:
<input type=”password” name=”password” />
</form>
</body>
</html>
Note: ফর্ম নিজে থেকে প্রদর্শিত হয়না। বেশির ভাগ ব্রাউজারে input value বাই ডিফল্ট ২০টি কারেক্টর থাকে। উপরের ফর্মে আমরা ২টি Input ফিল্ড নিয়েছি। ১. User Name: ২. Password: এবং এদের Input “type” অ্যাট্রিবিউট নিয়েছি User Name এর জন্য type=”text” এবং Password এর জন্য type=” password” । এই ”text” অ্যাট্রিবিউট এর কারণে আপনার উপরের ফর্মের থেকে ১টি Input টেক্সট ফিল্ড এবং ”password” অ্যাট্রিবিউট এর কারণে আপনার উপরের ফর্মের থেকে ১টি Input Password ফিল্ড পাবো।
এবার, উপরের কোড টুকুর আউটপুট ব্রাউজার এ প্রদর্শনের জন্য উইন্ডোজের Notepad অথবা Notepad++ সফটওয়্যারটি ওপেন করে কোডটুকু কপি-পেস্ট করুন। ফাইলের নাম দিন forminput1.html বা আপনার পছন্দ মতো এবং Save as type নির্বাচন করুন .html। এবার Save করুন। পেজটি ব্রাউজারে ওপেন করলে নিচের মত ইনপুট টেক্সট এবং পাসোয়ার্ড ফিল্ড দেখতে পাবেন…
তার মধ্যে input tag টি বহুল ব্যবহৃত। বিভিন্ন রকম Input সমূহ Attribute দ্বারা নির্দিষ্ট করা থাকে। যেমন:
Input Field: এই ফিল্ডটি যখন ইউজার কোন নম্বর বা লেখা Field এ input করে তখন ব্যবহার করা হয়।
Input Type: Input type এর উপরের নির্ভর করে ইউজার এর কোন ডাটা কিভাবে প্রদর্শন করবে। Input type অ্যাট্রিবিউট যদি type=”text” হয় তাহলে ইউজার এর ইনপুটকৃত তথ্য টেক্সট হিসেবে ব্রাউজার এ প্রদর্শন করবে। আর Input type অ্যাট্রিবিউট যদি type=” password” হয় তাহলে ইউজার এর ইনপুটকৃত তথ্য পাসওয়ার্ড(******) হিসেবে হিডেন দেখাবে। নিচের Input ট্যাগ এর উদাহরণ দুটি দেখুন:
Text Field:
<html>
<body>
<form action=” ”>
First Name: <input type =”text” name=”first_name”>
<br>
Last name: <input type =”text” name=”last_name”>
</from>
</body>
</html>
Note: উপরের ফর্মে আমরা ২টি Input ফিল্ড নিয়েছি। ১. First Name: ২. Last Name: এবং এদের Input “type” অ্যাট্রিবিউট নিয়েছি type=”text”। এই ”text” অ্যাট্রিবিউট এর কারণে আপনার উপরের ফর্মের থেকে ২টি Input টেক্সট ফিল্ড পাবো।
Password Field:
<html>
<body>
<form action=” ”>
User name:
<input type=”text” name=”user” />
<br>
Password:
<input type=”password” name=”password” />
</form>
</body>
</html>
Note: ফর্ম নিজে থেকে প্রদর্শিত হয়না। বেশির ভাগ ব্রাউজারে input value বাই ডিফল্ট ২০টি কারেক্টর থাকে। উপরের ফর্মে আমরা ২টি Input ফিল্ড নিয়েছি। ১. User Name: ২. Password: এবং এদের Input “type” অ্যাট্রিবিউট নিয়েছি User Name এর জন্য type=”text” এবং Password এর জন্য type=” password” । এই ”text” অ্যাট্রিবিউট এর কারণে আপনার উপরের ফর্মের থেকে ১টি Input টেক্সট ফিল্ড এবং ”password” অ্যাট্রিবিউট এর কারণে আপনার উপরের ফর্মের থেকে ১টি Input Password ফিল্ড পাবো।
এবার, উপরের কোড টুকুর আউটপুট ব্রাউজার এ প্রদর্শনের জন্য উইন্ডোজের Notepad অথবা Notepad++ সফটওয়্যারটি ওপেন করে কোডটুকু কপি-পেস্ট করুন। ফাইলের নাম দিন forminput1.html বা আপনার পছন্দ মতো এবং Save as type নির্বাচন করুন .html। এবার Save করুন। পেজটি ব্রাউজারে ওপেন করলে নিচের মত ইনপুট টেক্সট এবং পাসোয়ার্ড ফিল্ড দেখতে পাবেন…
0 comments:
Post a Comment