Indian Mobile No. Validation using Javascript and Jquery

 


Type 1 Validation using Javascript : -

<!DOCTYPE html>
<html>
<head>
    <title>Indian Mobile No. Validation</title>
</head>
<body>
<h1 style="text-align:center">Indian Mobile No. Validation</h1>
<form>
    <table align="center" border="30">
    
        <tr>
            <td>Mobile No.</td>
            <td><input type="text" id="mobile" maxlength="10"  placeholder="Enter Your Mobile No."  /></td>
        </tr>
        
        <tr>
            <td colspan="2">
                <input type="button" name="submit" value="Validate" onclick="mobile_validation();"  />
            </td>
        </tr>
    </table>
</form>

<script type="text/javascript">
    function mobile_validation() {

        var mobile1 = document.getElementById("mobile").value;
      
        // Allow A-Z, a-z, 0-9 .
        var pattern = /^[0-9]+$/;
        var mera_pattern=pattern.test(mobile1);

        if(mera_pattern==false){
          document.getElementById("mobile").value="";
          document.getElementById("mobile").focus();
          alert("Invalid Mobile No. !!!");
        }else{
          var six= mobile1.startsWith("6");
          var seven = mobile1.startsWith("7");
          var eight = mobile1.startsWith("8");
          var nine = mobile1.startsWith("9");
          
          var ok_number=0;
          if(six==true){
                ok_number=1;
          }else if(seven==true){
                ok_number=1;
          }else if(eight==true){
                ok_number=1;
          }else if(nine==true){
                ok_number=1;
          }else{
              ok_number=0;
          }
          
          if(ok_number==0){
               alert("Invalid No. Entered !!!");
                document.getElementById("mobile").value="";
                document.getElementById("mobile").focus();
             }else{
/////////////////Length checking///////////
                  if(mobile1.length==10){
                     alert("OK Your Entered Mobile No. is Valid");
                 }else{
                     alert('please type 10 digit');
                     document.getElementById("mobile").focus();
                 }
                     
                 

             }
          }
      }
   
</script>
</body>
</html>

 

Type 2 Validation using Jquery: -

<!DOCTYPE html>
<html>
<head>
    <title>Indian Mobile No. Validation</title>
</head>
<body>
<h1 style="text-align:center">Indian Mobile No. Validation</h1>
<form>
    <table align="center" border="30">
    
        <tr>
            <td>Mobile No.</td>
            <td><input type="text" id="mobile" maxlength="10"  placeholder="Enter Your Mobile No."  /></td>
        </tr>
        
        <tr>
            <td colspan="2">
                <input type="button" name="submit" value="Validate" onclick="mobile_validation();"  />
            </td>
        </tr>
    </table>
</form>
<script src="https://code.jquery.com/jquery-3.5.1.js" integrity="sha256-QWo7LDvxbWT2tbbQ97B53yJnYU3WhH/C8ycbRAkjPDc=" crossorigin="anonymous"></script>
<script type="text/javascript">
    function mobile_validation() {

        var mobile1 = $("#mobile").val();
      
        // Allow A-Z, a-z, 0-9 .
        var pattern = /^[0-9]+$/;
        var mera_pattern=pattern.test(mobile1);

        if(mera_pattern==false){
                $("#mobile").val("");
                $("#mobile").focus();
          alert("Invalid Mobile No. !!!");
        }else{
          var six= mobile1.startsWith("6");
          var seven = mobile1.startsWith("7");
          var eight = mobile1.startsWith("8");
          var nine = mobile1.startsWith("9");
          
          var ok_number=0;
          if(six==true){
                ok_number=1;
          }else if(seven==true){
                ok_number=1;
          }else if(eight==true){
                ok_number=1;
          }else if(nine==true){
                ok_number=1;
          }else{
              ok_number=0;
          }
          
          if(ok_number==0){
               alert("Invalid No. Entered !!!");
                $("#mobile").val("");
                $("#mobile").focus();
             }else{
/////////////////Length checking///////////
                  if(mobile1.length==10){
                     alert("OK Your Entered Mobile No. is Valid");
                 }else{
                     alert('please type 10 digit');
                    $("#mobile").focus();
                 }
                     
                 

             }
          }
      }
   
</script>
</body>
</html>

 

 

Comments

Post a Comment

Popular posts from this blog

Target class controller does not exist - Laravel 8

Image
  "In previous releases of Laravel, the RouteServiceProvider contained a $namespace property. This property's value would automatically be prefixed onto controller route definitions and calls to the action helper / URL::action method. In Laravel 8.x, this property is null by default. This means that no automatic namespace prefixing will be done by Laravel." Laravel 8.x Docs - Release Notes   You would have to use the Fully Qualified Class Name for your Controllers when referring to them in your routes when not using the namespace prefixing. use App \ Http \ Controllers \ UserController ; Route::get( '/users' , [UserController::class, 'index' ]); // or Route::get( '/users' , 'App\Http\Controllers\UserController@index' );  
Read more