Bootstrap Snippet Matching password and confirm password using HTML Javascript

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<form action="" onsubmit="return validation();">
            <div class=" w-100 bg-white rounded form-group" style="padding-left: 6%;padding-top: 4%;padding-bottom: 5%;">
                <div class="mb-2 mt-2 text-dark w-75 border-dark">
            <label for="">Username:</label>
            <input type="text" id="user" name="username" class="form-control" autocomplete="off">
            <span id="userid" class="text-info"></span>
            <br>
            <label for="">E-mail</label>
            <input type="email" id="mail" name="mailname" class="form-control" autocomplete="off">
            <span id="mailid" class="text-info"></span>
            <br>
            <label for="">Password</label>
            <input type="password" id="pass" name="passname" class="form-control" autocomplete="off">
            <span id="passid" class="text-info"></span>
            <br>
            <label for="">Confirm password</label>
            <input type="password" name="con" id="conpass" class="form-control" autocomplete="off">
            <span id="conid" class="text-info"></span>
            <br>
            <button class="btn " style="background-color: brown;">Submit</button>
            </div>
            </div>
        </form>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<script>
            function validation()
  {
    var username = document.getElementById("user").value , mailname=document.getElementById("mail").value , passname=document.getElementById("pass").value,con=document.getElementById("conpass").value;
       
        
       if(username ==='' )
   {
       
       document.getElementById("userid").innerHTML ="*** Plaese enter your Name***";
     
   return false;
   }
   if( mailname =='')
   {
       
       
       document.getElementById("mailid").innerHTML ="*** Plaese enter your E-mail***";
   
   return false;
   }
   if( passname =='' )
   {
       
    
   document.getElementById("passid").innerHTML ="*** Plaese enter your Password***";
   return false;
   }
   
   if( con =='')
   {
   document.getElementById("conid").innerHTML="***Enter your project name***";
   return false;
   }
  if(passname!=con)
   {
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

"Matching password and confirm password"
Bootstrap 4.1.1 Snippet by Amarabibi

Related: See More

Questions / Comments:

"Matching password and confirm password" Bootstrap 4.1.1 Snippet by Amarabibi

Related: See More

Questions / Comments:

"Matching password and confirm password"
Bootstrap 4.1.1 Snippet by Amarabibi