chriswiggins/bootstrap-show-password

Show/hide password plugin for twitter bootstrap.

Bootstrap Show Password

Show/hide password plugin for twitter bootstrap.

Demos

This plugin support bootstrap v2 and bootstrap v3.

Live demo

Usage

The plugin acts on <input> elements (typically password fields):

<input id="password" class="form-control" type="password" data-toggle="password">

Via data attributes

<input data-toggle="password">

Via JavaScript

$('#password').password();

Options

Options can be passed via data attributes or JavaScript. For data attributes, append the option name to data-, as in data-message="Show/hide password".

Name	Attribute	type	default	description
-	data-toggle	String	password	Active password without writing JavaScript.
placement	data-placement	String	after	The placement of show/hide icon, can be 'before' or 'after'.
message	data-message	String	Click here to show/hide password	The tooltip of show/hide icon.
white	data-white	Boolean	false	Show the white icon. (Just work in bootstrap v2)

Methods

.password('show')

Manually show the password.

$('#password).password('show');

.password('hide')

Manually hide the password.

$('#password).password('hide');

.password('toggle')

Manually toggle the password.

$('#password).password('toggle');

.password('val', [value]);

Get the current value of the password or set the value of password.

$('#password).password('val'); // get value
$('#password).password('val', 'password'); // set value

Events

The plugin exposes a few events.

Event Type	Description
show.bs.password	This event fires immediately when the show instance method is called. If caused by a click, the clicked element is available as the relatedTarget property of the event.
hide.bs.password	This event is fired immediately when the hide instance method has been called.

$('#password).on('show.bs.password', function (e) {
    // code here
});

Reporting issues

Please provide jsFiddle when creating issues!

It's really saves much time. Use this as template:

jsFiddle Bootstrap Show Password

Your feedback is very appreciated!

CHANGELOG

1.0.2

• Add val option.

1.0.1

• Via data attribute support.
• Rename file name to bootstrap-show-password.js
• Add bootstrap-show-password.min.js

1.0.0

• Initial release

LICENSE

The MIT License