diff --git a/app/code/Magento/Payment/view/frontend/web/js/model/credit-card-validation/credit-card-data.js b/app/code/Magento/Payment/view/frontend/web/js/model/credit-card-validation/credit-card-data.js new file mode 100644 index 0000000000000000000000000000000000000000..ef6dd82c179b4591a89a43987f72ca91ca974478 --- /dev/null +++ b/app/code/Magento/Payment/view/frontend/web/js/model/credit-card-validation/credit-card-data.js @@ -0,0 +1,19 @@ +/** + * Copyright © 2015 Magento. All rights reserved. + * See COPYING.txt for license details. + */ +/*jshint browser:true jquery:true*/ +/*global alert*/ +define( + [], + function() { + 'use strict'; + return { + creditCard: null, + creditCardNumber: null, + expirationMonth: null, + expirationYear: null, + cvvCode: null + } + } +); diff --git a/app/code/Magento/Payment/view/frontend/web/js/view/payment/cc-form.js b/app/code/Magento/Payment/view/frontend/web/js/view/payment/cc-form.js index b8c738f6b3db6a27522d2eae1ca9d594d3ca111a..4e9c7b833327486c835a460e6cad78a18dc91aaf 100644 --- a/app/code/Magento/Payment/view/frontend/web/js/view/payment/cc-form.js +++ b/app/code/Magento/Payment/view/frontend/web/js/view/payment/cc-form.js @@ -8,9 +8,10 @@ define( [ 'underscore', 'Magento_Checkout/js/view/payment/default', + 'Magento_Payment/js/model/credit-card-validation/credit-card-data', 'mage/translate' ], - function (_, Component, $t) { + function (_, Component, creditCardData, $t) { return Component.extend({ defaults: { creditCardType: '', @@ -34,6 +35,31 @@ define( ]); return this; }, + + initialize: function() { + this._super(); + + //Set credit card number to credit card data object + this.creditCardNumber.subscribe(function(value) { + console.log(value); + }); + + //Set expiration year to credit card data object + this.creditCardExpYear.subscribe(function(value) { + creditCardData.expirationYear = value; + }); + + //Set expiration month to credit card data object + this.creditCardExpMonth.subscribe(function(value) { + creditCardData.expirationYear = value; + }); + + //Set cvv code to credit card data object + this.creditCardVerificationNumber.subscribe(function(value) { + creditCardData.cvvCode = value; + }); + }, + getCode: function() { return 'cc'; }, diff --git a/app/code/Magento/Payment/view/frontend/web/template/payment/cc-form.html b/app/code/Magento/Payment/view/frontend/web/template/payment/cc-form.html index 52a675b890224981ef5ebd5eb4fa76f71ce6b5af..87dfe38b878d893a69ee54940ba2540bb11bc3f3 100644 --- a/app/code/Magento/Payment/view/frontend/web/template/payment/cc-form.html +++ b/app/code/Magento/Payment/view/frontend/web/template/payment/cc-form.html @@ -38,7 +38,8 @@ <input type="text" name="payment[cc_number]" class="input-text" value="" data-bind="attr: {id: getCode() + '_cc_number', title: $t('Credit Card Number'), 'data-container': getCode() + '-cc-number', 'data-validate': JSON.stringify({'required-number':true, 'validate-card-number':'#' + getCode() + '_cc_type', 'validate-cc-type':'#' + getCode() + '_cc_type'})}, enable: isActive($parents), - value: creditCardNumber"/> + value: creditCardNumber, + valueUpdate: 'keyup',"/> </div> </div> <div class="field date required" data-bind="attr: {id: getCode() + '_cc_type_exp_div'}">