JQuery Strong Random Password Generator Plugin

The jQuery fast password generator is a powerful random password app that generates random passwords based on combinations of user-defined password strength rules.

Must Read: Password Strength Meter Based On zxcvbn In Vue.js

Random Password Generator JQuery Plugin

Post NamejQuery Password Generator Plugin
Author Namessokurenko
CategoryForm Plugins, Password
Official PageClick Here | Click Here
Official Websitegithub.com
Publish DateJune 8, 2021
Last UpdateJuly 16, 2023
DownloadLink Below
LicenseMIT

How to make use of 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 the web page.

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

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

4. Load the password generator script after the jQuery library.

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

You can redefine all or specific options:

OptionDescriptionDefault value
lengthNumber of characters10
numbersUse numbers (0, 1, 2, etc…)true
lowercaseUse lowercase letters (a, b, c, etc…)true
uppercaseUse uppercase letters (A, B, C, etc…)true
specialUse special characters (!, @, #, $, etc…)false

See Demo And Download

jquery-password-generator-plugin

Official Website(ssokurenko): Click Here

This superior jQuery/javascript plugin is developed by ssokurenko. For extra Advanced Usage, please go to the official website.

Related Posts

Google-Translate-Dropdown-Customize-With-Country-Flag

Google Translate Dropdown Customize With Country Flag | GT API

Flag google translates jQuery text that takes advantage of the Google Cloud Translation API to translate web content between languages by selecting a country from the dropdown…

Bootstrap-Fileinput

HTML 5 File Input Optimized for Bootstrap 4.x./3.x with File Preview | Bootstrap Fileinput

bootstrap-fileinput is an improved HTML 5 file input  Bootstrap 5.x, 4.x and 3.x with file preview for different files, provides multiple selections, resumable section uploads, and more….

HStack-and-VStack-in-CSS

CSS Layout Components Horizontal/Vertical Stack | HStack and VStack

HStack and VStack in CSS – CSS layout components that (basically) stack anything horizontally and vertically. A pure CSS library that makes it easy to stack elements…

Floating-Whatsapp-Chat-Button

How to Add Floating Whatsapp Chat Button In HTML | venom-button

Venom Button is a very simple plugin for the jQuery floating WhatsApp button. Adds a floating button to your site that calls WhatsApp Click to Chat API. It will automatically start the WhatsApp…

Data-Table-Generator-Tabulator

Interactive Data Table Generator with JS/jQuery and JSON | Tabulator

Tabulator allows you to create interactive tables in seconds from any HTML Table, JavaScript array, AJAX data source, or JSON format data. Just include the library in your…

alert-confirm-prompt-attention-js

Simple Alert, Confirm, Prompt Popup Using Vanilla JavaScript Library | attention.js

JavaScript provides various built-in functionality to display popup messages for different purposes. Attention JS is a vanillaJS plugin used to create a custom alert, confirm, or Prompt…

Leave a Reply

Your email address will not be published. Required fields are marked *