Skip to content

martinwnet/zxcvbn-bootstrap-strength-meter

Repository files navigation

zxcvbn bootstrap password strength meter

A password strength meter using zxcvbn and Bootstrap.

Hooks the password strength library zxcvbn up to a Boostrap progress bar, packaged in a JQuery plugin.

Demo

Image of demo

##Example usage

<script type="text/javascript">
	$(document).ready(function () {
		$("#StrengthProgressBar").zxcvbnProgressBar({ passwordInput: "#Password" });
	});
</script>
<div class="form-group">
	<label for="Password">Password</label>
	<input type="password" class="form-control" id="Password" placeholder="Password">
</div>
<div class="progress">
	<div id="StrengthProgressBar" class="progress-bar"></div>
</div>

Additional options - userInputs, ratings

<script type="text/javascript">
	$(document).ready(function () {
		var userInputs = new Array();
		userInputs.push("john.smith@test.com");
		$("#StrengthProgressBar").zxcvbnProgressBar({
			  passwordInput: "#Password",
			  userInputs: userInputs,
			  ratings: ["Very Weak", "Weak", "OK", "Strong", "Very strong"]
		});
	});
</script>

About

A password strength meter using zxcvbn and Bootstrap.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published