HTML-এ required অ্যাট্রিবিউট কীভাবে ব্যবহার করবেন?

HTML-এ required অ্যাট্রিবিউটের ব্যবহার

HTML-এ required অ্যাট্রিবিউট ব্যবহার করা হয় এলিমেন্টটি ফর্ম সাবমিট করার আগে পূরণ করা উচিত তা নির্দিষ্ট করতে। যদি ফিল্ডটি পূরণ না থাকে এবং সাবমিট বাটন চাপা হয়, তবে একটি এরর জেনারেট হয়, যা ফর্ম সাবমিশন ব্যর্থ করে। এরর হবে "Please fill out this field"।

required অ্যাট্রিবিউট input, select এবং textarea এলিমেন্টে ব্যবহার করা যায়।

উদাহরণ

নিচের কোডটি চালিয়ে HTML-এ required অ্যাট্রিবিউটের ব্যবহার শিখুন:

<!DOCTYPE html>
<html>
  <head>
    <title>HTML required attribute</title>
  </head>
  <body>
    <h2>নিবন্ধন</h2>
    <form action="/new.php">
      <input type="text" placeholder="ছাত্র ব্যবহারকারীর নাম" name="name" required/><br>
      <input type="submit" value="সাবমিট">
    </form>
  </body>
</html>

ব্যাখ্যা:

• ব্রাউজার বিল্ট-ইন ভ্যালিডেশন করে (লাল বর্ডার, টুলটিপ)
• :required CSS পseudo-class দিয়ে স্টাইল করা যায়
• :invalid এবং :valid পseudo-class-ও কাজ করে
• JavaScript-এ element.checkValidity() দিয়ে চেক করা যায়

স্পেশাল টাইপ: type="email", type="url", type="number" ইত্যাদির সাথে কম্বাইন করলে টাইপ ভ্যালিডেশনও হয়।