Developer Guide Menu

Class: Microform

An instance of this class is returned when you create a Microform integration using 
flex.microform
 (see  Module: Flex ). This object allows the creation of Microform Fields.

Methods

createField(fieldType, optionsopt) > {Field}
Create a field for this Microform integration.
Parameters
Name
Type
Attributes
Description
fieldType
string
Supported values:
  • number
  • securityCode
options
object
To change these options after initialization use 
field.update()
.
Properties
Name
Type
Attributes
Default
Description
placeholder
string
Sets the 
placeholder
 attribute on the input.
title
string
Sets the  title  attribute on the input. Typically used to display tooltip text on hover.
description
string
Sets the input's description for use by assistive technologies using the  aria-describedby  attribute.
disabled
Boolean
false
Sets the 
disabled
 attribute on the input.
autoformat
Boolean
true
Enable or disable automatic formatting of the input field. This is only supported for number fields and will automatically insert spaces based on the detected card type.
maxLength
number
3
Sets the maximum length attribute on the input. This is only supported for 
securityCode
 fields and may take a value of 
3
 or 
4
.
styles
stylingOptions
Apply custom styling to this field
Returns
Type: Field
Examples
Minimal Setup
             
var flex = new Flex('.........'); var microform = flex.microform(); var number = microform.createField('number');
Providing Custom Styles
             
var flex = new Flex('.........'); var microform = flex.microform(); var number = microform.createField('number', { styles: { input: { 'font-family': '"Courier New", monospace' } } });
Setting the length of a security code field
             
var flex = new Flex('.........'); var microform = flex.microform(); var securityCode = microform.createField('securityCode', { maxLength: 4 });
createToken(options, callback)
Request a token using the card data captured in the Microform fields. A successful token creation will receive a transient token as its second callback parameter.
Parameter
Name
Type
Description
options
object
Additional tokenization options.
callback
callback
Any error will be returned as the first callback parameter. Any successful creation of a token will be returned as a string in the second parameter.
Properties
Name
Type
Attributes
Description
type
string
Three digit  Cybersource card type string . If set, this will override any automatic card detection.
expirationMonth
string
Two digit month string. Must be padded with leading zeros if single digit.
expirationYear
string
Four digit year string.
Examples
Minimal example omitting all optional parameters.
             
microform.createToken({}, function(err, token) { if (err) { console.error(err); return; } console.log('Token successfully created!'); console.log(token); });
Override the 
cardType
 parameter using a select element that is part of your checkout.
             
// Assumes your checkout has a select element with option values that are Cybersource card type codes: // var options = { type: document.querySelector('#cardTypeOverride').value }; microform.createToken(options, function(err, token) { // handle errors & token response });
Handling error scenarios
             
microform.createToken(options, function(err, token) { if (err) { switch (err.reason) { case 'CREATE_TOKEN_NO_FIELDS_LOADED': break; case 'CREATE_TOKEN_TIMEOUT': break; case 'CREATE_TOKEN_NO_FIELDS': break; case 'CREATE_TOKEN_VALIDATION_PARAMS': break; case 'CREATE_TOKEN_VALIDATION_FIELDS': break; case 'CREATE_TOKEN_VALIDATION_SERVERSIDE': break; case 'CREATE_TOKEN_UNABLE_TO_START': break; default: console.error('Unknown error'); break; } else { console.log('Token created: ', token); } });
Top