Post
Ask Question

Important Validation using JQuery

1. Phone number validation using jquery,
  1. <html>  
  2.   
  3. <head>  
  4.     //Import jquery.Min.js  
  5.     <script type="text/javascript">  
  6.         $.fn.isPhoneNumber = function(options) {  
  7.             intRegex = /^[0-9]{1,10}$/;  
  8.             phoneNumber = this.val();  
  9.             if ((phoneNumber.length != 10) || (!intRegex.test(phoneNumber))) {  
  10.                 this.val("");  
  11.                 this.attr("placeholder", "Invalid Phone Number");  
  12.                 return false;  
  13.             }  
  14.             return true;  
  15.         };  
  16.   
  17.         function validate() {  
  18.             $("#checkPhoneNumber").isPhoneNumber(this);  
  19.             return false;  
  20.         }  
  21.     </script>  
  22. </head>  
  23.   
  24. <body>  
  25.     <input type="text" id="checkPhoneNumber" value="ASDFG77" />  
  26.     <input type="button" onclick="return validate()" value="Validate" />  
  27. </body>  
  28.   
  29. </html>  
2. Postal code validation,
  1. <html>  
  2.   
  3. <head>  
  4.     //Import jquery.Min.js  
  5.     <script type="text/javascript">  
  6.         $.fn.isPostalCodeNumber = function(options) {  
  7.             intRegex = /^[0-9]{1,4}$/;  
  8.             postalcodeNumber = this.val();  
  9.             if ((postalcodeNumber.length != 10) || (!intRegex.test(postalcodeNumber))) {  
  10.                 this.val("");  
  11.                 this.attr("placeholder", "Invalid Postal Code Number");  
  12.                 return false;  
  13.             }  
  14.             return true;  
  15.         };  
  16.   
  17.         function validate() {  
  18.             $("#checkPostalCodeNumber").isPostalCodeNumber(this);  
  19.             return false;  
  20.         }  
  21.     </script>  
  22. </head>  
  23.   
  24. <body>  
  25.     <input type="text" id="checkPostalCodeNumber" value="ASDFG77" />  
  26.     <input type="button" onclick="return validate()" value="Validate" />  
  27. </body>  
  28.   
  29. </html>  
3. English validation,
  1. <html>  
  2.   
  3. <head>  
  4.     //Import jquery.Min.js  
  5.     <script type="text/javascript">  
  6.         var englishAlphabetAndWhiteSpace = /^[a-zA-Z ]*$/;  
  7.         if (!englishAlphabetAndWhiteSpace.test(this.val())) {  
  8.             this.val("");  
  9.             this.attr("placeholder", "Invalid English Alphabets");  
  10.             return false;  
  11.         }  
  12.         return true;  
  13.         };  
  14.   
  15.         function validate() {  
  16.             $("#checkEnglishAlphabets").isEnglishAlphabets(this);  
  17.             return false;  
  18.         }  
  19.     </script>  
  20. </head>  
  21.   
  22. <body>  
  23.     <input type="text" id="checkEnglishAlphabets" value="ASDFG77" />  
  24.     <input type="button" onclick="return validate()" value="Validate" />  
  25. </body>  
  26.   
  27. </html>  
4. Get the selected value form drop down,
  1. <html>  
  2.   
  3. <head>  
  4.     //Import jquery.Min.js  
  5. </head>  
  6.   
  7. <body>  
  8.     <select id="countries">  
  9. <option value="1">India</option>  
  10. <option value="2">China</option>  
  11. <option value="3">Russia</option>  
  12. <option value="4">Srilanka</option>  
  13. <option value="5">Pakistan</option>  
  14. </select>  
  15.     <input type="button" onclick="return getSelected()" value="Get Selected Value" />  
  16.     <script type="text/javascript">  
  17.         function getSelected() {  
  18.             alert($("#countries option:selected").text());  
  19.             alert($("#countries").val());  
  20.             return false;  
  21.         }  
  22.     </script>  
  23. </body>  
  24.   
  25. </html>