Academy

জাভাস্ক্রিপ্ট ফর্ম (JS Form)

Web Development - জাভাস্ক্রিপ্ট (JavaScript) - NCTB BOOK
Please, contribute to add content into জাভাস্ক্রিপ্ট ফর্ম (JS Form).
Content

জাভাস্ক্রিপ্ট ফর্ম ভ্যালিডেশন-(JS Form Validation)

জাভাস্ক্রিপ্ট ফর্ম ভ্যালিডেশন

জাভাস্ক্রিপ্টের মাধ্যমে এইচটিএমএল ফর্ম ভ্যালিডেশন করা যায়ঃ

kt_satt_skill_example_id=1303

যদি ফর্ম ফিল্ড খালি থাকে তবে ফর্ম সাবমিট হওয়া থেকে বিরত রাখতে এই ফাংশনটি একটি এলার্ট দিবে এবং false রিটার্ন করবে।

kt_satt_skill_example_id=1304

ফর্ম সাবমিট করলে validateForm() ফাংশনটি এক্সিকিউট হবে।


এইচটিএমএল ফর্ম ভ্যালিডেশন

ব্রাউজারের মাধ্যমে স্বয়ংক্রিয়ভাবে এইচটিএমএল ফর্ম ভ্যালিডেশন করা যায়।

নিচের উদাহরণে ইনপুট ফিল্ড খালি রেখে ফর্ম সাবমিট করলে required এট্রিবিউট ফর্ম সাবমিট করতে বাধা দিবে।

kt_satt_skill_example_id=1305

Noteইন্টারনেট এক্সপ্লোরার ৯ এবং তার আগের ভার্সনে এইচটিএমএল ফর্ম ভ্যালিডেশন সাপোর্ট করে না।

ডেটা ভ্যালিডেশন

ইনপুট ভ্যালু স্বচ্ছ, সঠিক এবং মানসম্মত করার জন্য ডাটা ভ্যালিডেশন করা হয়।

অধিকাংশ ক্ষেত্রে, ডেটা ভ্যালিডেশনের উদ্দেশ্য হচ্ছে কম্পিউটার এপ্লিকেশনে সঠিক তথ্য ইনপুট করা।

বিভিন্ন পদ্ধতিতে ডেটা ভ্যালিডেশন করা যায়ঃ

সার্ভার সাইড ভ্যালিডেশনঃ ওয়েব সার্ভারে ইনপুট ভ্যালু পাঠানোর পর ওয়েব সার্ভার ইনপুট ভ্যালিডেট করে।

ক্লায়েট সাইড ভ্যালিডেশনঃ ওয়েব সার্ভারে ইনপুট ভ্যালু পাঠানোর পূর্বে ওয়েব ব্রাউজার ইনপুট ভ্যালিডেট করে।


এইচটিএমএল কন্সট্রেইন্ট ভ্যালিডেশন

এইচটিএমএল ৫ ভ্যালিডেশনের একটি নতুন ধারনা দেয় যা কন্সট্রেইন্ট ভ্যালিডেশন নামে পরিচিত।

কন্সট্রেইন্ট ভ্যালিডেশনের ভিত্তিঃ

  1. এইচটিএমএল ইনপুট এট্রিবিউট
  2. সিএসএস স্যুডো ক্লাস
  3. ডোম প্রোপার্টি এবং মেথড
Content added || updated By

জাভাস্ক্রিপ্ট ফর্ম এপিআই-(JS Form API)

ডোম মেথড

প্রোপার্টিবর্ননাcheckValidity()ইনপুট এলিমেন্টে ভ্যালিড ডাটা থাকলে true রিটার্ন করে।
setCustomValidity()ইনপুট এলিমেন্টের validationMessage প্রোপার্টি সেট করে।  

ইনপুট এলিমেন্টে সঠিক তথ্য না থাকলে একটি ম্যাসেজ প্রদর্শন করবেঃ

kt_satt_skill_example_id=1312

ডোম প্রোপার্টি

প্রোপার্টিবর্ননা
validityইনপুট এলিমেন্টের ভ্যালিডিটি সম্পর্কিত বুলিয়ান প্রোপার্টি ধারণ করে।
validationMessageব্রাউজারে প্রদর্শনের জন্য একটি ভ্যালিডেশন ম্যাসেজ ধারণ করে।
willValidateইনপুট এলিমেন্ট ভ্যালিডেট হবে কিনা নির্দেশ করে।

ভেলিডিটি প্রোপার্টি

প্রোপার্টির নামবর্ননা 
customErrorযদি একটি কাস্টম ভ্যালিডিটি মেসেজ সেট করা হয়,তাহলে ইহা true সেট হয়। 
patternMismatchযদি একটি এলিমেন্টের ভ্যালু তার pattern এট্রিবিউটের সাথে না মিলে তাহলে ইহা true সেট হয়। 
rangeOverflowযদি একটি এলিমেন্টের ভ্যালু তার max এট্রিবিউট থেকে বড় হয় তাহলে true সেট হয়। 
rangeUnderflowযদি একটি এলিমেন্টের ভ্যালু তার min এট্রিবিউট থেকে ছোট হয় তাহলে true সেট হয়। 
stepMismatchযদি একটি এলিমেন্টের ভ্যালু তার step এট্রিবিউট অনুযায়ী ভ্যালিড না হয় তাহলে true সেট হয়। 
tooLongযদি একটি এলিমেন্টের ভ্যালু তার maxLength এট্রিবিউটের ভ্যালু থেকে বেশি হয় তাহলে ইহা true সেট হয়। 
typeMismatchযদি একটি এলিমেন্টের ভ্যালু তার type এট্রিবিউট অনুযায়ী ভ্যালিড না হয় তাহলে ইহা true সেট হয়। 
valueMissingযদি "required" এট্রিবিউটযুক্ত একটি এলিমেন্টের কোন ভ্যালু না থাকে তাহলে ইহা true সেট হয়। 
validযদি একটি এলিমেন্টের ভ্যালু ভ্যালিড হয় তাহলে ইহা true সেট হয়। 

উদাহরণ

যদি ইনপুট ফিল্ডের নম্বরটি ১০০ থেকে বড় হয় তাহলে একটি ম্যাসেজ প্রদর্শন করবেঃ

rangeOverflow প্রোপার্টি

kt_satt_skill_example_id=1315

যদি ইনপুট ফিল্ডের নম্বরটি ১০০ থেকে ছোট হয় তাহলে একটি ম্যাসেজ প্রদর্শন করবেঃ

rangeUnderflow প্রোপার্টি

kt_satt_skill_example_id=1318

Content added || updated By
Promotion