Adding custom credit card type to your payment method in Magento

At one point or another, you might want to implement a payment method with credit card types that are not implemented in Magento by default.
Please note that in this article you’ll learn how to add a new credit card type and validate it only. This article does not cover the whole payment module creation.

For the needs of this article, lets assume we have created a new payment module named NewModule and corresponding app/etc/modules/Inchoo_NewModule.xml file. We are going to implement Diners Club credit card type and validate it both server-side and client-side, the Magento way.

Steps

There are a few steps we have to go through in order to make the magic happen, the Magento way of course, and each one is equally important as the other.

• Add credit card type to global payment node in our config.xml
• Let Magento know which model are we using as our payment model
• Implement server-side validation in our model
• Implement client-side validation (Prototype)

Adding new credit card type

Lets hit it off by creating our etc/config.xml and adding credit card type to it:

<config>
<modules>
<Inchoo_NewModule>
<version>1.0.0</version>
</Inchoo_NewModule>
</modules>
 
<global>
<payment>
<cc>
<types>
<DC>
<code>DC</code>
<name>Diners Club</name>
<order>60</order>
</DC>
</types>
</cc>
</payment>
</global>
</config>

This doesn’t do much yet, as we have just added a credit card type to Magento without telling it what model to use and how to validate it.

Creating payment model

Lets stay in our etc/config.xml for a lil’ bit. We have to configure our model and tell Magento what model to use by adding the following code:

<config>
...
<global>
...
<models>
<newmodule>
<class>Inchoo_NewModule_Model</class>
</newmodule>
</models>
...
</global>
 
<default>
<payment>
<newmodule>
<model>newmodule/payment</model>
</newmodule>
</payment>
</default>
</config>

Now we have to create a file Inchoo/NewModule/Model/Payment.php and it has to extend Mage_Payment_Model_Method_Cc.
This is the place where we’ll use our custom Regex pattern for credit card number and CVV.
If you’re implementing a different credit card type, you’ll need a Regex pattern that corresponds to it.

class Inchoo_NewModule_Model_Payment extends Mage_Payment_Model_Method_Cc
{
protected $_code = 'inchoo_newmodule';
 
public function getVerificationRegEx()
{
return array_merge(parent::getVerificationRegEx(), array(
'DC' => '/^[0-9]{3}$/' // Diners Club CCV
));
}
 
public function OtherCcType($type)
{
return in_array($type, array('OT', 'DC'));
}
 
public function validate()
{
parent::validate();
/* we call parent's validate() function!
* if the code got this far, it means the cc type is none of the supported
* ones implemented by Magento and now it gets interesting
*/
 
$info = $this->getInfoInstance();
$ccNumber = $info->getCcNumber();
$availableTypes = explode(',',$this->getConfigData('cctypes'));
// checks if Diners Club card is allowed
if(!in_array($info->getCcType(), $availableTypes)){
Mage::throwException($this->_getHelper()->__('Credit card type is not allowed for this payment method.'));
}
// validate credit card number against Luhn algorithm
if(!$this->validateCcNum($info->getCcNumber())){
Mage::throwException($this->_getHelper()->__('Invalid Credit Card Number'));
}
 
/* this is Diners Club regex pattern.
* it's different for every cc type, so beware
*/
if($info->getCcType()=='DC' && !preg_match('/^3(?:0[0-5]|[68][0-9])[0-9]{11}$/', $ccNumber)){
Mage::throwException($this->_getHelper()->__('Credit card number mismatch with credit card type.'));
}
// now we retrieve our CCV regex pattern and validate against it
$verificationRegex = $this->getVerificationRegEx();
if(!preg_match($verificationRegex[$info->getCcType()], $info->getCcCid()))
{
Mage::throwException($this->_getHelper()->__('Please enter a valid credit card verification number.'));
}
 
// further validation here (expiration month, expiration year etc.)
 
}
 
}

Now that sums up our Diners Club card number and CCV number validation part. You’ll probably want to make additional checks in validate() method, such as credit card expiration date.

Client-side validation in Prototype

There are two ways we can tackle this issue.
The first one would be creating a .js file and including it via layout XML file where we need it. The second one would include modifying layout XML file only.
We’ll do it the second way here.

<config>
...
<frontend>
<layout>
<updates>
<newmodule>
<file>newmodule.xml</file>
</newmodule>
</updates>
</layout>
</frontend>
</config>

It’s time to modify the layout file and implement Javascript at checkout onepage. In case you haven’t created the layout xml file already, create it at design/frontend/base/default/layout/newmodule.xml with the following code:

<layout version="1.0.0">
<checkout_onepage_index>
<reference name="head">
<block type="core/text" name="newmodule.diners.validation">
<action method="setText">
<text>
<![CDATA[<script type="text/javascript">
Validation.creditCartTypes.set('DC', [new RegExp('^3(?:0[0-5]|[68][0-9])[0-9]{11}$'), new RegExp('^[0-9]{3}$'), true]);
</script>]]>
</text>
</action>
</block>
</reference>
</checkout_onepage_index>
</layout>

We should add Diners Club to the list of allowed credit card types in our NewModule config.xml likewise:

<config>
...
<default>
<payment>
<newmodule>
<model>newmodule/payment</model>
<cctypes>VI,AE,DC</cctypes> //Visa (VI), American Express (AE) and Diners Club (DC)
</newmodule>
</payment>
</default>
</config>

Show’s over folks! We have successfully implemented a custom credit card into Magento! 🙂