I have an online payment module where a user will be redirected to merchant page and by entering credit card details, the order will be created.I am saving those credit card details in db.

And I need to show those saved cards as a dropdown on a checkout page.

So For that I have created a new custom offline payment module where I need to show those details in dropdown and on selecting particular credit card, those details need to attach to payment object and order being placed

Can you please guide on how to achieve it in magento2 as the payment code is rendering from HTML pages

  • Storing credit card data in your db is not safe & valid ,
    – Yogesh
    Nov 11, 2017 at 5:49
  • @Yogesh : As of now,i am storing those details in db later i will be fetching it from payment gateway
    – S.Venky
    Nov 11, 2017 at 6:32
  • Okay , Please post your code so getting more idea about that.
    – Yogesh
    Nov 11, 2017 at 6:34
  • @venki Can u please check my Question I tried to follow the Answer for this Question, I couldn't make it. if possible please share your module. May 20, 2018 at 7:54
  • @venki Have you able to achive your requirment? Actually I also want that. I have saved card details in db but now I want to use that card details for order place. Jan 31, 2020 at 20:09

1 Answer 1


Please follow this question so you can get idea how to pass data payment form , this is basic version you need to add your data so you can get card drop down there same way. create configprovider.php and di.xml.

I have posted basic code which you can modified as per your requirement. create SampleConfigProvider.php under File



 namespace Namespace\Modulename\Model;

 use Magento\Checkout\Model\ConfigProviderInterface;

  * Class SampleConfigProvider
 class SampleConfigProvider implements ConfigProviderInterface

  public function getStoredCards(){
    $result = array();
    $result['0'] = "Test";
    $result['1'] = "Test1";
    return $result;

  public function getConfig()

  $config = array_merge_recursive($config, [
     'payment' => [
        \Namespace\Modulename\Model\Payment::CODE => [
            'storedCards' => $this->getStoredCards(),
  return $config;

add below method in test-method.js add method :

getStoreCard: function() {
        return  window.checkoutConfig.payment.checkmo.storedCards;

    getCardList: function() {
        return _.map(this.getStoreCard(), function(value, key) {
            return {
                'value': key,
                'type': value

add in your_html.html file (Namespace\Modulename\view\frontend\web\template\payment) :

<select name="payment[subscription_id]" class="select input-text required-entry" 
                                attr: {id: getCode()+'_payment_profile_id'},
                                options: getCardList(),
                                optionsValue: 'value',
                                optionsText: 'type',
                                optionsCaption: $t('--Please Select--'),
  • I followed the above steps and successfully created select field with credit card details dropdown in the checkout page.Can i know how i can attach those details to payment object while placing order
    – S.Venky
    Nov 11, 2017 at 12:14
  • ok sure i will create another question
    – S.Venky
    Nov 11, 2017 at 12:19
  • Don't forgot to accept it :)
    – Yogesh
    Nov 11, 2017 at 12:29
  • Tried to accept it but it showing "Thanks for the feedback! Votes cast by those with less than 15 reputation are recorded, but do not change the publicly displayed post score."
    – S.Venky
    Nov 11, 2017 at 12:31
  • You are not able to upvote , you can accept answer because after 15 reputation you are able to give upvote.
    – Yogesh
    Nov 11, 2017 at 12:33

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.