PIN Code Verification Plugin In jQuery - segmentedInput.js

File Size: 3.71 KB
Views Total: 852
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
PIN Code Verification Plugin In jQuery - segmentedInput.js

A tiny and simple-to-implement jQuery plugin to create segmented input fields for PIN code verification.

How to use it:

1. Create a normal input field and specify how many PIN code slot should create using the maxlength attribute:

<!-- Required -->
<input type="text" class="pin" maxlength="4" autofocus />

<!-- Optional -->
<input type="submit" />

2. Download and load the jQuery segmentedInput.js plugin after jQuery library.

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

3. Initialize the plugin on the input field and done.

$(document).ready(function(){
  $('.pin').segmentedInput({
    // options
  });
});

4. Determine whether to automatically verify users identity after PIN code has been filled. Default: false.

$(document).ready(function(){
  $('.pin').segmentedInput({
    autoSubmit: true,
  });
});

5. Add extra CSS class(es) to the input. Default: empty.

$(document).ready(function(){
  $('.pin').segmentedInput({
    fieldClasses: 'class1 class2',
  });
});

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