File "code07.html"

Full Path: /home/analogde/www/Design/fileman/Fusion/formulaire_bootstrap/code07.html
File size: 2.82 KB
MIME-type: text/html
Charset: utf-8

 
Open Edit   Advanced Editor   Back 
<!--
https://www.sitepoint.com/community/t/how-to-match-two-password/366684
-->
<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
</head>
<body>

<script>

function validation() {
  var password1 = document.getElementById("inputpassword").value;
  var password2 = document.getElementById("inputconfirmpassword").value;
  var email1 = document.getElementById("inputemail").value;


  // Validate through RegularExpression
  var passwordcheck1 = /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[^a-zA-Z0-9])(?!.*\s).{8,15}$/;
  var emailcheck = /^[A-Za-z_]{3,}@[A-Za-z]{3,}[.]{1}[A-Za-z.]{2,6}$/;

  if (passwordcheck1.test(password1)) {
    document.getElementById("spanpassword").innerHTML = "";
  } else {
    document.getElementById("spanpassword").innerHTML = "Invalid Password";
    return false;
  }

  if (password1.match(password2)) {
    document.getElementById("spanconfirmpassword").innerHTML = "No password matched";
  } else {
    document.getElementById("spanconfirmpassword").innerHTML = "Password matched";
    return false;
  }

  if (emailcheck.test(email1)) {
    document.getElementById("spanemail").innerHTML = "";
  } else {
    document.getElementById("spanemail").innerHTML = "Enter valid email address";
    return false;
  }

}


</script>

<h1 class="text-center bg-dark text-white">UserForm Registration with the help of Regular Expression</h1>
<div class="container">
  <br>
  <form onsubmit="return validation()">

    <!-- Password -->
    <div class="form-group">
      <label>Password:</label>
      <input type="text" name="" id="inputpassword" class="form-control" placeholder="Password">
      <span id="spanpassword" class="text-danger font-weight-bold"></span>
    </div>

    <!-- ConfirmPassword -->
    <div class="form-group">
      <label>Confirm Password:</label>
      <input type="text" name="" id="inputconfirmpassword" class="form-control" placeholder="Confirm Password">
      <span id="spanconfirmpassword" class="text-danger font-weight-bold"></span>
    </div>

    <!-- EmailAddress -->
    <div class="form-group">
      <label>Email Address:</label>
      <input type="text" name="" id="inputemail" class="form-control" placeholder="Email">
      <span id="spanemail" class="text-danger font-weight-bold"></span>
    </div>

    <br>
    <!-- submit <button> -->
    <input type="submit" name="" class="btn btn-primary">
  </form>
</div>

</body>
</html>