value অ্যাট্রিবিউট একটি ইনপুট ফিল্ডের প্রাথমিক মান নির্ধারণ করে:
<form action="">
First name:<br>
<input type="text" name="firstname" value="John">
</form>readonly অ্যাট্রিবিউট নির্ধারণ করে যে ইনপুট ফিল্ডটি শুধু পড়ার জন্য (পরিবর্তন করা যাবে না):
<form action="">
First name:<br>
<input type="text" name="firstname" value="John" readonly>
</form>disabled অ্যাট্রিবিউট নির্ধারণ করে যে ইনপুট ফিল্ডটি নিষ্ক্রিয়।
একটি নিষ্ক্রিয় ইনপুট ফিল্ড ব্যবহারযোগ্য বা ক্লিকযোগ্য নয়, এবং ফর্ম জমা দেওয়ার সময় এর মান পাঠানো হবে না:
<form action="">
First name:<br>
<input type="text" name="firstname" value="John" disabled>
</form>size অ্যাট্রিবিউট ইনপুট ফিল্ডের আকার (অক্ষরের সংখ্যায়) নির্ধারণ করে:
<form action="">
First name:<br>
<input type="text" name="firstname" value="John" size="40">
</form>maxlength অ্যাট্রিবিউট ইনপুট ফিল্ডের সর্বোচ্চ অনুমোদিত দৈর্ঘ্য নির্ধারণ করে:
<form action="">
First name:<br>
<input type="text" name="firstname" maxlength="10">
</form>maxlength
maxlength অ্যাট্রিবিউট কোনো ফিডব্যাক দেয় না। ব্যবহারকারীকে সতর্ক করতে চাইলে, আপনাকে JavaScript কোড লিখতে হবে।
মনে রাখবেন: ইনপুট রেস্ট্রিকশন সম্পূর্ণ নির্ভরযোগ্য নয়, এবং JavaScript দিয়ে অবৈধ ইনপুট দেওয়ার অনেক উপায় আছে। ইনপুট নিরাপদভাবে সীমাবদ্ধ করতে হলে, রিসিভারকেও (সার্ভার) এটি যাচাই করতে হবে!
HTML5-এ <input>-এর জন্য নিচের অ্যাট্রিবিউটগুলো যোগ করা হয়েছে:
এবং <form>-এর জন্য নিচের অ্যাট্রিবিউটগুলো:
autocomplete অ্যাট্রিবিউট নির্ধারণ করে যে একটি ফর্ম বা ইনপুট ফিল্ডের অটোকমপ্লিট চালু নাকি বন্ধ থাকবে।
অটোকমপ্লিট চালু থাকলে, ব্যবহারকারী আগে যে মানগুলো দিয়েছিলেন তার ভিত্তিতে ব্রাউজার স্বয়ংক্রিয়ভাবে ইনপুট মান সম্পূর্ণ করে দেয়।
টিপস: ফর্মের জন্য অটোকমপ্লিট "চালু" এবং নির্দিষ্ট কিছু ইনপুট ফিল্ডের জন্য "বন্ধ" রাখা সম্ভব, অথবা এর উল্টোটাও।
autocomplete অ্যাট্রিবিউট <form> এবং নিচের <input> টাইপগুলোর সাথে কাজ করে: text, search, url, tel, email, password, datepickers, range, এবং color।
<form action="" autocomplete="on">
First name:<input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
E-mail: <input type="email" name="email" autocomplete="off"><br>
<input type="submit">
</form>টিপস: কিছু ব্রাউজারে এটি কাজ করার জন্য আপনাকে অটোকমপ্লিট ফাংশন সক্রিয় করতে হতে পারে।
novalidate একটি <form> অ্যাট্রিবিউট।
এটি থাকলে, novalidate নির্ধারণ করে যে ফর্ম জমা দেওয়ার সময় ডেটা ভ্যালিডেট করা হবে না।
<form action="" novalidate>
E-mail: <input type="email" name="user_email">
<input type="submit">
</form>autofocus অ্যাট্রিবিউট নির্ধারণ করে যে পেজ লোড হওয়ার সময় ইনপুট ফিল্ডটি স্বয়ংক্রিয়ভাবে ফোকাস পাবে।
পেজ লোড হওয়ার সময় "First name" ইনপুট ফিল্ডটি স্বয়ংক্রিয়ভাবে ফোকাস পাক:
<form action="">
First name: <input type="text" name="fname" autofocus>
</form>form অ্যাট্রিবিউট নির্ধারণ করে যে একটি <input> এলিমেন্ট এক বা একাধিক কোন ফর্মের অন্তর্গত।
HTML ফর্মের বাইরে অবস্থিত একটি ইনপুট ফিল্ড (তবুও যা ফর্মের অংশ):
<form action="" id="form1">
First name: <input type="text" name="fname"><br>
<input type="submit" value="Submit">
</form>
Last name: <input type="text" name="lname" form="form1">formaction অ্যাট্রিবিউট এমন একটি ফাইলের URL নির্ধারণ করে, যা ফর্ম জমা দেওয়ার সময় ইনপুট কন্ট্রোল প্রসেস করবে।
formaction অ্যাট্রিবিউট <form> এলিমেন্টের action অ্যাট্রিবিউটকে ওভাররাইড করে।
formaction অ্যাট্রিবিউট type="submit" এবং type="image"-এর সাথে ব্যবহার করা হয়
ভিন্ন ভিন্ন action-সহ দুটি সাবমিট বাটনযুক্ত একটি HTML ফর্ম:
<form action="">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<input type="submit" value="Submit"><br>
<input type="submit" formaction="/action_page2.php"
value="Submit as admin">
</form>formenctype অ্যাট্রিবিউট নির্ধারণ করে ফর্ম জমা দেওয়ার সময় ডেটা কীভাবে এনকোড করা হবে (শুধুমাত্র method="post" যুক্ত ফর্মের জন্য)।
formenctype অ্যাট্রিবিউট <form> এলিমেন্টের enctype অ্যাট্রিবিউটকে ওভাররাইড করে।
formenctype অ্যাট্রিবিউট type="submit" এবং type="image"-এর সাথে ব্যবহার করা হয়।
ডিফল্টভাবে এনকোড করা ফর্ম-ডেটা পাঠান (প্রথম সাবমিট বাটন), এবং "multipart/form-data" হিসেবে এনকোড করা ডেটা পাঠান (দ্বিতীয় সাবমিট বাটন):
<form action="" method="post">
First name: <input type="text" name="fname"><br>
<input type="submit" value="Submit">
<input type="submit" formenctype="multipart/form-data"
value="Submit as Multipart/form-data">
</form>formmethod অ্যাট্রিবিউট action URL-এ ফর্ম-ডেটা পাঠানোর HTTP মেথড নির্ধারণ করে।
formmethod অ্যাট্রিবিউট <form> এলিমেন্টের method অ্যাট্রিবিউটকে ওভাররাইড করে।
formmethod অ্যাট্রিবিউট type="submit" এবং type="image"-এর সাথে ব্যবহার করা যায়।
দ্বিতীয় সাবমিট বাটনটি ফর্মের HTTP মেথড ওভাররাইড করে:
<form action="" method="get">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<input type="submit" value="Submit">
<input type="submit" formmethod="post" value="Submit using POST">
</form>formnovalidate অ্যাট্রিবিউট <form> এলিমেন্টের novalidate অ্যাট্রিবিউটকে ওভাররাইড করে।
formnovalidate অ্যাট্রিবিউট type="submit"-এর সাথে ব্যবহার করা যায়।
দুটি সাবমিট বাটনযুক্ত একটি ফর্ম (একটি ভ্যালিডেশন সহ, অন্যটি ছাড়া):
<form action="">
E-mail: <input type="email" name="userid"><br>
<input type="submit" value="Submit"><br>
<input type="submit" formnovalidate value="Submit without validation">
</form>formtarget অ্যাট্রিবিউট এমন একটি নাম বা কীওয়ার্ড নির্ধারণ করে, যা ফর্ম জমা দেওয়ার পর প্রাপ্ত ফলাফল কোথায় দেখানো হবে তা নির্দেশ করে।
formtarget অ্যাট্রিবিউট <form> এলিমেন্টের target অ্যাট্রিবিউটকে ওভাররাইড করে।
formtarget অ্যাট্রিবিউট type="submit" এবং type="image"-এর সাথে ব্যবহার করা যায়।
ভিন্ন ভিন্ন টার্গেট উইন্ডোসহ দুটি সাবমিট বাটনযুক্ত একটি ফর্ম:
<form action="">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<input type="submit" value="Submit as normal">
<input type="submit" formtarget="_blank"
value="Submit to a new window">
</form>height এবং width অ্যাট্রিবিউট একটি <input type="image"> এলিমেন্টের উচ্চতা ও প্রস্থ নির্ধারণ করে।
সবসময় ইমেজের আকার উল্লেখ করুন। ব্রাউজার আকার না জানলে, ইমেজ লোড হওয়ার সময় পেজ ফ্লিকার করবে।
height এবং width অ্যাট্রিবিউটসহ একটি ইমেজকে সাবমিট বাটন হিসেবে নির্ধারণ করুন:
<input type="image" src="img_submit.gif" alt="Submit" width="48" height="48">list অ্যাট্রিবিউট এমন একটি <datalist> এলিমেন্ট নির্দেশ করে, যাতে একটি <input> এলিমেন্টের জন্য পূর্বনির্ধারিত অপশন থাকে।
<input list="browsers">
<datalist id="browsers">
<option value="Internet Explorer">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>min এবং max অ্যাট্রিবিউট একটি <input> এলিমেন্টের সর্বনিম্ন ও সর্বোচ্চ মান নির্ধারণ করে।
min এবং max অ্যাট্রিবিউট নিচের ইনপুট টাইপগুলোর সাথে কাজ করে: number, range, date, datetime-local, month, time এবং week।
Enter a date before 1980-01-01:
<input type="date" name="bday" max="1979-12-31">
Enter a date after 2000-01-01:
<input type="date" name="bday" min="2000-01-02">
Quantity (between 1 and 5):
<input type="number" name="quantity" min="1" max="5">multiple অ্যাট্রিবিউট নির্ধারণ করে যে ব্যবহারকারী <input> এলিমেন্টে একাধিক মান দিতে পারবেন।
multiple অ্যাট্রিবিউট নিচের ইনপুট টাইপগুলোর সাথে কাজ করে: email এবং file।
একাধিক মান গ্রহণ করে এমন একটি ফাইল আপলোড ফিল্ড:
Select images: <input type="file" name="img" multiple>pattern অ্যাট্রিবিউট একটি রেগুলার এক্সপ্রেশন নির্ধারণ করে, যার সাথে মিলিয়ে এলিমেন্টের মান যাচাই করা হয়।
pattern অ্যাট্রিবিউট নিচের ইনপুট টাইপগুলোর সাথে কাজ করে: text, search, url, tel, email, এবং password।
টিপস: ব্যবহারকারীকে সাহায্য করতে pattern ব্যাখ্যা করতে গ্লোবাল title অ্যাট্রিবিউট ব্যবহার করুন।
টিপস: আমাদের JavaScript টিউটোরিয়ালে রেগুলার এক্সপ্রেশন সম্পর্কে আরও জানুন।
শুধুমাত্র তিনটি অক্ষর (কোনো সংখ্যা বা বিশেষ চিহ্ন ছাড়া) নিতে পারে এমন একটি ইনপুট ফিল্ড:
Country code: <input type="text" name="country_code" pattern="[A-Za-z]{3}" title="Three letter country code">placeholder অ্যাট্রিবিউট এমন একটি ইঙ্গিত নির্ধারণ করে, যা একটি ইনপুট ফিল্ডের প্রত্যাশিত মান বর্ণনা করে (একটি নমুনা মান বা ফরম্যাটের সংক্ষিপ্ত বিবরণ)।
ব্যবহারকারী একটি মান দেওয়ার আগে ইনপুট ফিল্ডে এই ইঙ্গিতটি প্রদর্শিত হয়।
placeholder অ্যাট্রিবিউট নিচের ইনপুট টাইপগুলোর সাথে কাজ করে: text, search, url, tel, email, এবং password।
<input type="text" name="fname" placeholder="First name">required অ্যাট্রিবিউট নির্ধারণ করে যে ফর্ম জমা দেওয়ার আগে একটি ইনপুট ফিল্ড অবশ্যই পূরণ করতে হবে।
required অ্যাট্রিবিউট নিচের ইনপুট টাইপগুলোর সাথে কাজ করে: text, search, url, tel, email, password, date pickers, number, checkbox, radio, এবং file।
Username: <input type="text" name="usrname" required>step অ্যাট্রিবিউট একটি <input> এলিমেন্টের বৈধ সংখ্যার ব্যবধান নির্ধারণ করে।
উদাহরণ: step="3" হলে, বৈধ সংখ্যা হতে পারে -3, 0, 3, 6 ইত্যাদি।
টিপস: বৈধ মানের একটি রেঞ্জ তৈরি করতে step অ্যাট্রিবিউট max এবং min অ্যাট্রিবিউটের সাথে একত্রে ব্যবহার করা যায়।
step অ্যাট্রিবিউট নিচের ইনপুট টাইপগুলোর সাথে কাজ করে: number, range, date, datetime-local, month, time এবং week।
একটি নির্দিষ্ট বৈধ সংখ্যার ব্যবধানসহ একটি ইনপুট ফিল্ড:
<input type="number" name="points" step="3">