Magento – Select Payment Method on Click

checkoutonepage-checkout

We use 3 payment methods and I want to select a payment method if the customer clicks on the li class.

We use this code:

<li class="formListBlock" onclick="$('p_method_<?php echo $_code ?>').checked=true;payment.switchMethod('<?php echo $_code ?>')"<?php if($this->getSelectedMethodCode()==$_code): ?> checked="checked"<?php endif; ?>>
<?php if(!$oneMethod): ?>
    <input id="p_method_<?php echo $_code ?>" value="<?php echo $_code ?>" type="radio" name="payment[method]" title="<?php echo $this->escapeHtml($_method->getTitle()) ?>" onclick="payment.switchMethod('<?php echo $_code ?>')"<?php if($this->getSelectedMethodCode()==$_code): ?> checked="checked"<?php endif; ?> class="radio" />
<?php else: ?>
    <span class="no-display"><input id="p_method_<?php echo $_code ?>" value="<?php echo $_code ?>" type="radio" name="payment[method]" checked="checked" class="radio" /></span>
    <?php $oneMethod = $_code; ?>
<?php endif; ?>
    <label for="p_method_<?php echo $_code ?>"><?php echo $this->escapeHtml($this->getMethodTitle($_method)) ?> <?php echo $this->getMethodLabelAfterHtml($_method) ?><span class="gratis">Gratis</span></label>
<?php if ($html = $this->getPaymentMethodFormHtml($_method)): ?>
<span class="payment_icon_<?php echo $_code ?>"></span>
<div class="formListBlock-selector">
    <ul class="form-list ops-form-list" id="payment_form_ops_iDeal" style="display:none;">
<li>
    <select name="payment[iDeal_issuer_id]" id="ops_iDeal_issuer_id" class="required-entry">
    <option value=""><?php echo $this->__('--Please Select--')?></option>
        <?php foreach ($issuers as $key => $value): ?>
            <option value=<?php echo $this->escapeHtml($key) ?>>
                <?php echo $this->escapeHtml($value) ?>
            </option>
        <?php endforeach; ?>
    </select>
</li>
    <button type="button" class="button" onclick="payment.save()"><span><span><?php echo $this->__('Continue') ?></span></span></button>
</ul>
    </div>
    <?php endif; ?>
    </li>

Error on Chrome console:

Failed to load resource: net::ERR_CACHE_MISS

<script>(function() {with (this[2]) {with (this[1]) {with (this[0]) {return function(event) {$('p_method_ops_iDeal').checked=true;payment.switchMethod('ops_iDeal')
};}}}})</script>

How can I select the radio button by clicking the li and make it work on every browser?

Best Answer

Try

<li class="control" onclick="$('p_method_<?php echo $_code ?>').checked=true;" <?php if($this->getSelectedMethodCode()==$_code): ?> checked="checked"<?php endif; ?> >
    <input id="p_method_<?php echo $_code ?>" value="<?php echo $_code ?>" type="radio" name="payment[method]" title="<?php echo $this->escapeHtml($_method->getTitle()) ?>" onclick="payment.switchMethod('<?php echo $_code ?>')"<?php if($this->getSelectedMethodCode()==$_code): ?> checked="checked"<?php endif; ?> class="radio" />