VGS Collect Examples

Here you can find examples of use cases for the VGS Collect JS library.

What is it?

The VGS Collect library is a javascript library that allows you to integrate secure fields with non-secure fields in your page. The secure fields behave like traditional input fields while preventing access to the unsecured data.

Once the fields are initialized the library communicates the state of the fields through a JavaScript callback. The state object includes information about the validity, focused value and if the user has entered information in the field.

Explore VGS Collect documentation

You can find more useful information about VGS Collect API in our docs.

VGS Collect examples

Use case examples

Name	Used data	Code example	Live demo
Credit card	Cardholder name Card number Expiration date CVC	Code	Demo
Login data	Email Password	Code	Demo
PII data	Full name SSN	Code	Demo
Shipping info	Full name Address Country City State ZIP code	Code	Demo
Multiplexing	Cardholder name Card number Expiration date CVC configured to match multiplexing API	Code	Contact us

Feature examples

Name	Preview	Code example	Live demo
Capture BIN number		Code	Demo
Compare field values		Code	Demo
Conditional rendering		Code	Demo
Extended card brands		Code	Demo
Input masking		Code	Demo
Submit on Enter		Code	Demo

Customization examples

Name	Preview	Code example	Live demo
Floating labels		Code	Demo
Single line payment form		Code	Demo