verification-code-input
Reactive icon

Verification Code Input

Stable version 1.0.2 (Compatible with OutSystems 11)
Uploaded on 6 Mar by 
0.0
 (0 ratings)
verification-code-input

Verification Code Input

Details
This component provides an input field to enter a verification (or confirmation) code in a set of separate, connected input fields. Currently only supports number codes (of any length). An event is triggered when the code is changed.
Read more

This component provides an input field to enter a verification (or confirmation) code in a set of separate, connected input fields.  

Currently only supports number codes (of any length).

An event is triggered when the code is filled in completely.

The component has three input parameters:

  • Length
    • This is the length of the expected code. This determines the amount of input fields.
  • IsAutoFocus
    • True if the first verification code input field should automatically get focus. False if not. Defaults to True.
  • ExtendedClass
    • Put extra css classes in here.


The VerificationCodeInput component supports the following:

  • Pasting a complete code
  • Navigating between fields using the left and right arrow keys
  • Using Backspace to clear the code field by field
  • Using Delete to clear the code field by field
  • Selecting the input text when clicking an input, so that the code is replaced when typing a new number
  • Triggers an event when the code is changed. The event also has an input parameter IsComplete to show if the code is complete or not.


Release notes (1.0.2)
  • Small bugfix
  • Removed unused dependencies in demo
License (1.0.2)
Reviews (0)