Question

I have a website with a credit card payment form on it that I have used on other very similar websites. I am having a problem in that when the page loads, the credit card payment option is automatically selected and normally the dropdown list of credit cards shows. However, on this site the list is not showing until a second click occurs on the radio button which is showing as already selected. If anyone has any information as to what might be causing this I would be very grateful indeed! The problem can be seen at www.seed-city.com (NSFW) if you add anything to your cart and view the cart page. Thank you for your time.

You can see the problem here:

http://www.seed-city.com/index.php?option=com_virtuemart&page=shop.cart&add_id%5B%5D=270&qadd_270=10

The code I have is:

<div class="yagendoo_vm_checkout_credit_input">
        <table>
            <tr>
                <td nowrap width="10%" align="left"><?php echo $VM_LANG->_('VM_CREDIT_CARD_TYPE'); ?>:</td>
                <td>          
                    <script language="Javascript" type="text/javascript"><!--
                        writeDynaList( 'class="inputbox" name="creditcard_code" size="1"',
                        orders, originalPos, originalPos, originalOrder );
                        //-->
                    </script>
                    <?php 
                        $db_cc->reset();
                        $payment_class = $db_cc->f("payment_class");
                        $require_cvv_code = "YES";
                        if(file_exists(CLASSPATH."payment/$payment_class.php") && file_exists(CLASSPATH."payment/$payment_class.cfg.php")):
                            require_once(CLASSPATH."payment/$payment_class.php");
                            require_once(CLASSPATH."payment/$payment_class.cfg.php");
                            $_PAYMENT = new $payment_class();
                            if( defined( $_PAYMENT->payment_code.'_CHECK_CARD_CODE')):?>
                                <?php $require_cvv_code = strtoupper( constant($_PAYMENT->payment_code.'_CHECK_CARD_CODE'));?>
                            <?php endif;
                    endif;?>
                </td>
            </tr>
            <tr valign="top">
                <td nowrap width="10%" align="left">
                    <label for="order_payment_name">
                        <?php echo $VM_LANG->_('PHPSHOP_CHECKOUT_CONF_PAYINFO_NAMECARD') ?>:
                    </label>
                </td>
                <td>
                    <input type="text" class="inputbox" id="order_payment_name" name="order_payment_name" value="<?php if(!empty($_SESSION['ccdata']['order_payment_name'])) echo $_SESSION['ccdata']['order_payment_name'] ?>" autocomplete="off" />
                </td>
            </tr>
            <tr valign="top">
                <td nowrap width="10%" align="left">
                    <label for="order_payment_number"><?php echo $VM_LANG->_('PHPSHOP_CHECKOUT_CONF_PAYINFO_CCNUM') ?>:</label>
                </td>
                <td>
                    <input type="text" class="inputbox" id="order_payment_number" name="order_payment_number" value="<?php if(!empty($_SESSION['ccdata']['order_payment_number'])) echo $_SESSION['ccdata']['order_payment_number'] ?>" autocomplete="off" />

More code:

        foreach( $cards as $code => $name ) {

            $script .= "orders[".$i++."] = new Array( '".addslashes($db_cc->f("payment_method_name"))."','$code','$name' );\n";

        }



        }

        $script .= "function changeCreditCardList() { \n";

        $script .= "var selected_payment = null;

  for (var i=0; i<document.adminForm.payment_method_id.length; i++)

     if (document.adminForm.payment_method_id[i].checked)

        selected_payment = document.adminForm.payment_method_id[i].id;\n";

        $script .="changeDynaList('creditcard_code',orders,selected_payment, originalPos, originalOrder);\n";

        $script .="}\n";

        $script .="//-->\n";

        $script .="</script>\n";

        $script .= '<noscript>'.ps_html::selectList('creditcard_code', key($cards), $cards ).'</noscript>';

        return $script;

    }

}

Answer 1

You have a select with no items:

<select class="inputbox" name="creditcard_code" size="1"> </select>

The items are loaded via the script above it

/*<![CDATA[*/var originalOrder = '1';
var originalPos = 'payment_method_id_3';
var orders = new Array();   // array in the format [key,value,text]
orders[0] = new Array( 'payment_method_id_3','VISA','Visa' );
orders[1] = new Array( 'payment_method_id_3','MC','MasterCard' );
orders[2] = new Array( 'payment_method_id_3','jcb','JCB' );
orders[3] = new Array( 'payment_method_id_3','australian_bc','Australian Bankcard' );
orders[4] = new Array( 'payment_method_id_3','SWITCH','Maestro' );
function changeCreditCardList() { 
var selected_payment = null;
      for (var i=0; i<document.adminForm.payment_method_id.length; i++)
         if (document.adminForm.payment_method_id[i].checked)
            selected_payment = document.adminForm.payment_method_id[i].id;
op_changeDynaList('creditcard_code',orders,selected_payment, originalPos, originalOrder);
}/*]]>*/

I assume the op_changeDynaList function is supposed to load the select with the array. And it seems that changeCreditCardList is probably the onchange handler.

Again, this is stuff that should be in the question. But, I don’t see where the list is actually loaded the first time. You probably need to call one of the functions (like changeCreditCardList) manually after the page loads, rather than waiting for the first event to be fired.