Strong Random Password Generator In jQuery

A simple and configurable password generator app for generating strong random passwords based on sets of password strength rules selected by the user.

Built using jQuery library and styled with the latest Bootstrap 5 framework (optional).

How to use it:

1. Add options to the password generator.

<form class="formulario">
  <div class="alert alert-warning" id="alert-no-option" role="alert">
    Select at least one option!
  </div>
  <div class="col-sm">
    <div class="mb-3 form-check">
      <input type="checkbox" class="form-check-input" id="numbers">
      <label class="form-check-label" for="numbers">Numbers [0-9]</label>
    </div>
  </div>
  <div class="col-sm">
    <div class="mb-3 form-check">
      <input type="checkbox" class="form-check-input" id="lowercase">
      <label class="form-check-label" for="lowercase">Lowercase letters [a-z]</label>
    </div>
  </div>
  <div class="col-sm">
    <div class="mb-3 form-check">
      <input type="checkbox" class="form-check-input" id="uppercase">
      <label class="form-check-label" for="uppercase">Uppercase letters [A-Z]</label>
    </div>
  </div>
  <div class="col-sm">
    <div class="mb-3 form-check">
      <input type="checkbox" class="form-check-input" id="special">
      <label class="form-check-label" for="special">Special characters [!@#$%^&*()?]</label>
    </div>
  </div>
  <div class="col-sm">
    <div class="form-floating mb-3" id="quantity-form">
      <input type="number" min="8" class="form-control" id="quantity" value=8 required>
      <label for="quantity">Characters quantity</label>
    </div>
  </div>
  <button type="submit" id="send-button" class="btn btn-primary">Generate</button>
</form>

2. Create an input field to hold the generated password.

<input class="form-control" id="password" type="text" readonly>
<br>
<div class=" text-center alert alert-success" id="copied-alert" role="alert">
  Copied!
</div>

3. Hide the 'No Option' and 'Password Copied' messages on page.

#alert-no-option{
  display: none;
}

#copied-alert{
  display: none;
  margin: 0 auto;
  width: 300px;
  font-size: 20px;
}

4. Load the main password generator script after jQuery library and done.

<script src="/path/to/cdn/jquery.slim.min.js"></script>
<script src="/path/to/js/scripts.js"></script>

---

This awesome jQuery plugin is developed by ssokurenko. For more Advanced Usages, please check the demo page or visit the official website.