Apply custom styling to the credit card iframe fields
var nvtag_callbacks = window.nvtag_callbacks = window.nvtag_callbacks || {};
nvtag_callbacks.alterFormDefinition= nvtag_callbacks.alterFormDefinition|| [];
nvtag_callbacks.alterFormDefinition.push(function (args) {
if(args && args.form_definition && args.form_definition.form_elements) {
var paymentInfo;
for(var i = 0; i < args.form_definition.form_elements.length; i++){
var topLevel = args.form_definition.form_elements[i];
if(topLevel && topLevel.name === 'PaymentInformation'){
paymentInfo = topLevel;
break;
}
}
if(paymentInfo && paymentInfo.children){
var account, cvv, exp;
for(var j = 0; j < paymentInfo.children.length; j++){
var child = paymentInfo.children[j];
if(child && child.name === 'Account'){
account = child;
} else if(child && child.name === 'SecurityCode'){
cvv = child;
} else if(child && child.name === 'ExpirationMonth') {
exp = child;
}
}
if(account){
console.log('updating Account styling');
account.styles = { color: 'red' }; // add style overrides
}
if(cvv){
console.log('updating SecurityCode styling');
cvv.styles = { color: 'green' }; // add style overrides
}
if(exp){
console.log('updating Expiration Date styling');
exp.styles = { color: 'yellow' }; // add style overrides
}
}
}
console.log('alterFormDef', args);
return args;
});