Question

I have the following mark-up:

    <dt>

        <input id="p_method_checkmo" value="checkmo" type="radio" name="payment[method]" title="Check / Money order" onclick="payment.switchMethod('checkmo')" class="radio" />
        <label for="p_method_checkmo">Check / Money order </label>
</dt>
    <dt>
        <input id="p_method_ccsave" value="ccsave" type="radio" name="payment[method]" title="Credit Card (saved)" onclick="payment.switchMethod('ccsave')" class="radio" />
        <label for="p_method_ccsave">Credit Card (saved) </label>
</dt>

I need to snag some jQuery onto the click (or change) events. After lots of debugging, I’ve found that the inline onclick event is over-ruling and jQuery selectors that I try to use. Is there any way I can plug some jQuery to run whenever that method (payment.switchMethod) is run? I thought about using preventDefault() to stop the click event on document ready, but I’m not sure if this is a good idea, or the best way of going about things.

I CANNOT edit the mark up in any way, unfortunately.

Any advice is massively appreciated. I’ve attached the jQuery below for reference:

    // Check for payment selection.  Upon selection mark it as 'hitpayment' in db
jQuery("input[name=payment\\[method\\]]:radio").change(function(){
    alert('hello');
    var cartPalPayment = {};

    cartPalPayment['user_id'] = '<?=$_SESSION['user_id']?>';
    cartPalPayment['referer'] = '<?=$_SESSION['referer']?>';
    cartPalPayment['license_key'] = cartPalLicenseKey;

    jQuery.ajax({
            url: 'integration/magento1.4/set_payment.php',
        cache: false,
            dataType: 'jsonp',
        data: cartPalPayment
        });
});

Answer 1

Ok so it sounds like you need to run the original function as well. Just swap out (redefine) the payment.switchMethod function with your own, and call it from within your new function:

var evilFunction = payment.switchMethod;
// Ninja-swap payment.switchMethod() with your own.
payment.switchMethod = function(evilArgs) {
   // Do whatever you want here
   alert("Got your nose");

   // Call original function
   evilFunction(evilArgs);
};

Just be sure to run the above on document load (or anytime AFTER payment.switchMethod was defined). You’re effectively injecting your own code into payment.switchMethod so you don’t even need to attach event listeners to the element.