JavaScript in Hindi : Form Validation

JavaScript Form Validation 

  • Introduction JavaScript form validation in Hindi 
  • Types of JavaScript form validation in Hindi 
  • Examples of JavaScript form validation in Hindi

Introduction to JavaScript Form Validation 

Forms के द्वारा user से information ली जाती है। लेकिन आपको ये check करना जरुरी है की user ने जो values input की वो appropriate है या नहीं है। Database में हमेंशा valid values होनी चाहिए इससे processing में कोई difficulties नहीं आती है।

यदि user के द्वारा input की गई values appropriate नहीं है तो user को एक message display किया जाता है और valid values input करने के लिए कहा जाता है। ये process validation कहलाती है।

HTML में data को validate करने का कोई तरीका नहीं है। Normally validation जब user form को submit कर देता है तो server side पर perform किया जाता है। लेकिन JavaScript आपको client side validation perform करने की ability provide करती है।

Steps of JavaScript Form Validation 

  1. जब भी आप किसी form को validate करते है तो सबसे पहले ये check करते है की सभी fields में values input की गई है या नहीं। यदि ऐसा नहीं है तो user को values input करने का message display किया जाता है। 
  2. इसके बाद ये validate किया जाता है की fields में डाली गई सभी values appropriate form में हो जैसे की age field में कोई string ना input करे आदि।      

Validating for Empty Fields 

किसी form में कुछ fields ऐसे होते है जिनको fill करना necessary होता है जैसे की name, email आदि। यदि आप ये चाहते है की user उस necessary field को empty ना छोड़े तो इसके लिए आप उस field पर validation perform कर सकते है।

जब user form submit करे तो आप चेक कर सकते है की उस necessary field में value है या नहीं। Value नहीं होने पर आप कोई message show कर सकते है। इसके लिए आप DOM का यूज़ कर सकते है क्योंकि field में कोई value है या नहीं ये dynamically form submit करते समय चेक किया जायेगा।

आप कोई function create कर सकते है जो की submit button के click होने पर call होगा। और इसमें आप document object के द्वारा उस field की value को check कर सकते है। ये एक बहुत ही easy process है। लेकिन इसे आपको उन्हीं fields पर apply करना चाहिए जिनमें values डालना necessary हो। इसका उदाहरण नीचे दिया जा रहा है। 

<!– formValidationDemo.html –>

<html>

<head>
<title>Form Validation Demo 1</title>
<script type=”text/javascript”>
function myFunction()
{
    // Storing input box value in variable 
    var val = document.myForm.Name.value;
    // Checking whether value is entered or not
    if(val==””)
    {
        alert(“This field can not be left blank”);
    }
    else
    {
        document.write(“Welcome “,document.getElementById(“name”).value);
    }
}
</script>

</head>
<body>
<form name=”myForm”>
<!– Taking input from user –>
Enter your Name : <input type=”text” id=”name” name=”Name”>
<!– Calling javascript function when form submitted –>
<input type=”button” value=”Submit” onclick=”myFunction();”>
</form>
</body>
</html>

ऊपर दी गयी script निचे दिया गया webpage generate करती है।

javascript-form-validation-example-output

यदि आप बिना कोई value enter किये form को submit करेंगे तो आपको एक message show होगा नहीं तो जो value आपने enter की है वो आपको welcome message के साथ show हो जाएगी।   

Validating Appropriate Form of Input 

Empty fields के लिए check करने के साथ ही आपको ये भी चेक करना होता है की जो values user ने डाली है वो valid है या नहीं। उदाहरण के लिए आपके form में एक password field है और आप चाहते है की user इसमें 8 characters से कम ना input कर सके।

इसके लिए आप user के input को अपने validity criteria से compare करके decision ले सकते है। इसका उदाहरण नीचे दिया गया है।

<!– javascriptFormDataValidation.html –>

<html>

<head>
<title>Form Validation Demo 1</title>
<script type=”text/javascript”>
function myFunction()
{
    // Storing input boxes data in variables 
    var name = document.myForm.Name.value;
    var pass = document.myForm.Pass.value;
    // Checking whether data is inputed or not
    if(name==””)
    {
        alert(“PLEASE ENTER YOUR NAME!!!”);
    }
    // Showing message if password length is below 8 characters 
    else if(pass.length<8)
    {
         alert(“PASSWORD MUST BE AT LEAST 8 CHARACTERS LONG!!!”);
    }
    else
   {
        document.write(“Welcome “,name);
   }
}
</script>

</head>
<body>
<form name=”myForm”>
<!– Taking name and password from user –>
Enter your Name : <input type=”text” name=”Name”> <br />
Enter your Password: <input type=”password” name=”Pass”> <br />
<!– Calling javascript function when form submitted. –>
<input type=”button” value=”Submit” onClick=”myFunction();”>
</form>
</body>
</html>

ऊपर दी गयी script निचे दिया गया web page generate करती है।

javascript-form-validation-example2-output

12 thoughts on “JavaScript in Hindi : Form Validation”

  1. Can you please provide the complete form validation with regular expression using JavaScript?

    1. I think java is good for games. And for social networking site you must master database technology (Say MySQL), web development (HTML, CSS, PHP, JavaScript, JQUERY).

  2. You explained JS in a lucid. Very good and memorable experience of learning. It's like that I am in a class sitting before you and you are explaining line by line sometimes even word by word. Thank a ton Sir! What should I do to become a front-end designer?

    1. Thanks for your encouraging words. To become a front end developer start with small things like html & CSS then go deeper learn scripting like javascript, PHP then JQuery & other frameworks.

      Most amazing thing you can do is keep learning and build something of your own. In that way you will be able to apply what you have learned in real world. So in the end you will know what works and what does not. You will learn many things like users don't like colours or heavy desinging compared to ease of use.

    1. Yedi mene aapke prashan ko thik se samjha h to Koi bhi database website se independent Hota h. kisi database me information aap kisi application se bhi le skate h or kisi website se bhi le sakte h. Ya fir dono bhi use kar sakte h. Udaaharan ke liye AADHAR card ko software ke dvara banaya jata h or ise website par dekha jata h.

      Inquiry kese lete h ye us software par depend karega or sath hi konsa database use kiya ja raha h is baat par bhi

Comments are closed.