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



ইউজারের সাথে যোগাযোগের জন্য প্রতিটা ওয়েব সাইটেই ফর্ম একটই অতি গুরুত্বপূর্ণ একটি বিষয়। যেমন ওয়েব সাইটে নিবন্ধন করা, কাস্টোমার থেকে অর্ডার সংগ্রহণ করা সহ অসংখ্য কাজ ফর্মের মাধ্যমে করা হয়। ফর্ম পূরণ করে ডাটাগুলো সার্ভারে পাঠানোর আগেই যদি প্রতিটা ফিল্ড চেক করে দেখা হয় যে কোথাও ভুল আছে কি না তবে অনেক সময় বাচে, আর এই কাজটিই হল "ফর্ম ভেলিডেশন"।


ফর্ম ভেলিডেশন কি?

জাভাস্ক্রিপ্ট ফর্ম ভেলিডেশন এমন একটি কৌশল যার মাধ্যমে ব্যবহারকারীগন ডাটা সাবমিট করার আগে তার ফর্ম এর তথ্য যাচাই করে। জাভাস্ক্রিপ্ট আপনাকে সাহায্যকারী এলার্ট দেখাবে এবং সেটা ব্যবহারকারীগনকে জানাবে যে তার তথ্যটি ভুল বা অসম্পূর্ণ ছিল এবং আরও বলবে যে কিভাবে সে সমস্যাটি সমাধান করতে পারবে। ফর্ম ভেলিডেশন দিয়ে যে কাজ করা যায় -

* ইনপুট ফিল্ড খালি আছে কি না চেক করা,
* ইনপুট ফিল্ডে সব সংখ্যা আছে কি না চেক করা,
* ইনপুট ফিল্ডে প্রয়োজনের চেয়ে কম বা বেশি ক্যারেক্টার ইনপুট করা হয়েছে কি না তা না চেক করা,
* ইমেইল এড্রেসটি বৈধ কিনা,
* সঠিক ফরম্যাটের ডাটা ইনপুট করা হয়েছে কি না তা না চেক করা।


ইনপুট ফিল্ড চেক করা

এটা একটা সাধারণ টাইপের ফর্ম ভ্যালিডেশন । আপনি এর মাধ্যমে নিশ্চিত হতে পারবেন যে ব্যবহারকারী এইচটিএমএল ফিল্ড এর মধ্যে ডাটা লিখেছে কিনা। এইচটিএমএল ইনপুট ফিল্ড যদি খালি থাকে তবে একটা এলার্ট ম্যাসেজ দেখাবে এবং ডাটা সার্ভারে সাবমিট করবে না। নিচে এর একটি উদাহরণ দেখুন।

উদাহরণ দেখুন

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function validateForm()
{
var x=document.forms["myForm"]["fname"].value;
if (x==null || x=="")
{
alert("First name must be filled out");
return false; }
}
</script>
</head>
<body>
form name="myForm" action="demo_form.asp" onsubmit="return validateForm()" method="post">
First name: <input type="text" name="fname">
<input type="submit" value="Submit">
</form>
</body>
</html>




ইমেইল ভেলিডেশন

ব্যবহারকারীর ইমেইলটি বৈধ কিনা তা আপনি চেক করতে পারবেন । একটি বৈধ ইমেইলে অবশ্যই একটই @ সাইন এবং ডট (.) থাকতে হবে যেখানে @ সাইনটিই ইমেইল এর প্রথম ক্যারেক্টার হবে না এবং শেষের ডট (.) টি অবশ্যই @ সাইনের পরে হবে এবং অবশ্যই ডটের পরে অন্ততপক্ষে দুটি ক্যারেক্টার হবে।

একটি Valid উদাহরণ হল -
info@websschool.com
কিছু Invalid উদাহরণ হল -
@websschool.com - @ sign এর আগে কোন character নেই।
free!dom@websschool.com - invalid character !
ceo@webs_school.com - domain name এ underscores ব্যবহার করা হয় না।
নিচে এর একটি উদাহরণ দেখুন।

উদাহরণ দেখুন

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function validateForm()
{
var x=document.forms["myForm"]["email"].value;
var atpos=x.indexOf("@");
var dotpos=x.lastIndexOf(".");
if (atpos<1 || dotpos=x.length)
{
alert("Not a valid e-mail address");
return false;
}
}
</script>
</head>
<body>
<form name="myForm" action="demo_form.asp" onsubmit="return validateForm();"method="post">
Email: <input type="text" name="email">
<input type="submit" value="Submit">
</form>
</body>
</html>




গেটএলিমেন্টবাইআইডি

আপনি কি কখনও জাভাস্ক্রিপ্ট ব্যবহার করে ফর্ম ভ্যালিডেশন করেছেন? টেক্সট ফিল্ডে কোন ভ্যালু যাচাই করতে কোন সমস্যায় পড়েছেন? একটা সহজ উপায়ের মাধ্যমে এইচটিএমএল এলিমেন্ট নিয়ন্ত্রণ করতে পারেন। আইডি এট্রিবিউট এবং গেটএলিমেন্টবাইআইডি ফাংশনের মাধ্যমে তা করতে পারেন।

উদাহরণ দেখুন

<html>
<head>
<script type="text/javascript">
function notEmpty(){
var myTextField = document.getElementById('myText');
if(myTextField.value != "")
alert("You entered: " + myTextField.value)
else
alert("Would you please enter some text?")
}
</script>
</head>
<body>
<input type='text' id='myText' />
<input type='button' onclick='notEmpty()' value='Form Checker' />
</body>
</html>


document.getElementById টি myText এইচিটএমএল এলিমেন্ট এর রেফারেন্সকে রিটার্ন করে। আমরা এই রেফারেন্সকে myTextField নামক ভেরিয়েবলে জমা করতে পারি।

যখন আপনি getElementById function ব্যবহার করবেন তখন আপনাকে কিছূ বিষয় সম্বন্ধে নিশ্চিত হওয়া প্রয়োজন। আপনাকে অবশ্যই মনে রাখা প্রয়োজন যে গেটএলিমেন্টবাইআইডি হল ডকুমেন্ট অবজেক্ট এর পদ্ধতি বা ফাংশন। আপনি এই গেটএলিমেন্টবাইআইডি ফাংশন ব্যবহার করতে চাইলে আপনাকে অবশ্যই এইচটিএমএল এলিমেন্ট এর আইডি এট্রিবিউট ব্যবহার করতে হবে।







এই ওয়েব সাইট এর সমস্ত টিউটোরিয়াল, সার্কিট ডায়াগ্রাম, উদাহরণ ইত্যাদি খুব সহজ ও সাধারণ ভাবে তৈরি করা হয়েছে। টিউটোরিয়াল, সার্কিট ডায়াগ্রাম, উদাহরণ ইত্যাদির ভুল পরিহার করার জন্য বার বার যাচাই করা হয়েছে, কিন্তু আমরা এর পূর্ণ নিশ্চয়তা ও দায়ভার বহন করি না। যখন আপনি এই সাইটটি ব্যবহার করেন, আমরা ধরে নেই যে আপনি পড়েছেন এবং সম্মত আছেন আমাদের টার্মস অফ ইউস (Terms of use) এবং প্রাইভেসি পলিসি( Privacy policy) সম্পর্কে।

Report or suggest about this page

Copyright 2016-2018 by websschool.com, All Rights Reserved.