এইচটিএমএল ফরম উপাদানসমূহ (HTML Form Elements)

শরিফুল ইসলাম
Job category-Php Coder

<input>Element:

ফর্ম element এর মধ্যে সবচেয়ে গুরুত্বপূর্ণ element হল <input> element. এই element টি বিভিন্ন বিষয়ের উপর ভিক্তি করে বিভিন্ন রকম হয়ে থাকে।

<select> Element (drop-down-list):

উদাহরনঃ

 <select name="cars">
 <option value="volvo">Volvo</option>
 <option value="saab">Saab</option>
 <option value="fiat">Fiat</option>
 <option value="audi">Audi</option>
 </select>

ফলাফল

<option> element পছন্দ মতন কনটেন্ট সিলেক্ট অপশন থেকে নির্বাচন করার জন্য ব্যবহার করা হয়। তালিকাতে সাধারনত প্রথম অপশন টি সিলেক্ট করা থাকে।

উদাহরণ

<option value="fiat" selected>Fiat</option>

ফলাফল

<textarea> Element

ইনপুট ফিল্ডের অনেকগুলো লাইন লিখার ক্ষেত্রে আমরা <textarea> ব্যবহার করে থাকি।

উদাহরণ

<textarea name="message" rows="10" cols="30">
The cat was playing in the garden.
</textarea>

ফলাফল

<button> element

কোন বাটন কে ক্লিক করার জন্য আমরা এই element টি ব্যবহার করে থাকি।

উদাহরণ

<button type="button" onclick="alert('Hello World!')">Click Me!</button>

ফলাফল

Click Me!

এইচটিএমএল ৫ <datalist> element

Pre-defined অপশন্‌স এর তালিকা থেকে ইনপুট এর উপাদান এর জন্য দাতালিস্ত ব্যবহার করা হয়। ইউজার রা pre-defined অপশন্‌স এর একটি তালিকা দেখতে পাবে ডাটা ইনপুট দেওয়ার জন্য। এই জন্য <datalist> element এর ভিতর ID attribute নিশ্চিতভাবে ডিফাইন করে দিতে হবে।

উদাহরণ

<form action="action_page.php">
<input list="browsers">
<datalist id="browsers">
   <option value="Internet Explorer">
   <option value="Firefox">
   <option value="Chrome">
   <option value="Opera">
   <option value="Safari">
</datalist>
</form>

ফলাফল

এইচটিএমএল ৫ <keygen> element

ইউজার রা নিরাপদ ভাবে বৈধতা ঘোষণা করার জন্য এই element ব্যবহার করা হয় । এই element এর মাধ্যমে একজোড়া ফিল্ড তৈরি হয় ফর্ম এর মধ্যে। যখন ফর্ম সাবমিট করা হয় দুই ধরনের key তৈরি হয়। একটি প্রাইভেট এবং পাবলিক। প্রাইভেট key লোকাল ভাবে জমা হয় এবং পাবলিক key সার্ভার এ পাঠানো হয়। client কে certify করার ক্ষেত্রে এই প্রাইভেট key ব্যবহার করা হয় যাতে ভবিষ্যতে এই ইউজার কে অথিনটিকেত করা যায়।

উদাহরণ

<form action="action_page.php">
Username: <input type="text" name="user">
Encryption: <keygen name="security">
<input type="submit">
form>

ফলাফল

এইচটিএমএল ৫ <output> element

কোন ক্যালকুলাসন করার জন্য এবং তার ফলাফল দেখানোর জন্য এই element ব্যবহার করা হয়

উদাহরণ

<form action="action_page.asp"
 oninput="x.value=parseInt(a.value)+parseInt(b.value)">
 0
 <input type="range"  id="a" name="a" value="50">
 100 +
 <input type="number" id="b" name="b" value="50">
 =
 <output name="x" for="a b"></output>
 <br><br>
 <input type="submit">
 </form>

ফলাফল

এইচটিএমএল ফর্ম elements