Magento Expert Forum - Improve your Magento experience

Results 1 to 2 of 2

Prototype addMethods - Checkout Step

  1. #1
    New member
    Join Date
    Jan 2015
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Prototype addMethods - Checkout Step

    Hello all,

    I'm new to this forum so I apologize now if this post is in the wrong board.

    I'm working on an extension that fires after save payment, before review on checkout. I've got everything as far as the module complete and I'm having an issue with overriding a method in the Payment class (in opcheckout.js).

    The prior developer to me, simply added their own copy of the file with modified information, and commented out the original call for this file. This would not work as we'd like this to be done without needing any override or manual changes in .ptml files. I've already had to rewrite everything else used, and this is my last step in completing the extension.

    I am attempting to use addMethods() from prototype, or wrap the function, however the original method is being called still (I have a console message in both functions).

    The particular method I am trying to override is Payment.nextStep. I need to add an additional check within this function which incurs a pop-up to the user when JSON sends back error => popup (I am using popup1 to test)

    Here is my code to override the function. It's found in a file opcheckoutmod.js included AFTER the original opcheckout.js.

    PHP Code:
    // Start addMethods(); to override Magento 
    if (typeof Payment !== 'undefined') {

        
    Payment.addMethods({
            
    nextStep: function(transport){ 
            
                
    console.log('Here'); // Added to see if this runs
                
                
    if (transport && transport.responseText){
                    try{
                        
    response = eval('(' transport.responseText ')');
                    }
                    catch (
    e) {
                        
    response = {};
                    }
                }
                
                if (
    response.error) {
                    if (
    response.error == 'popup1'){
                        
    // Run my code
                    
    }
                }            
                 
                if (
    response.error) {
                    if (
    response.fields) {
                        var 
    fields response.fields.split(',');
                        for (var 
    i=0;i<fields.length;i++) {
                            var 
    field null;
                            if (
    field = $(fields[i])) {
                                
    Validation.ajaxError(fieldresponse.error);
                            }
                        }
                        return;
                    }
                    
    //alert(response.error);
                    
    return;
                }

                
    checkout.setStepResponse(response);

                
    // checkout.setPayment();
            
    }
        });
        
    // End addMethods(); 
    I've not had any luck using this and I've included it both inline and within a separate file, but both times in DOM it shows the correct path to the function definition so it does not make sense why this original is being used.

    The same occurs with prototype wrap, which an example is below:

    PHP Code:
    Payment.prototype.nextStep
       
    Payment.prototype.nextStep.wrap(function(parentMethod){
                     
    alert("hello world");
    }); 
    Does anyone have a clue as to what else is missing? I can provide access to see the site via PM if needed.

    Thanks in advance!

    View more threads in the same category:


  2. #2
    Junior Member
    Join Date
    Oct 2016
    Location
    MONA TILES COMPOUND, NR. CHHANI CIRCLE, CHHANI ROAD, VADODARA - 390002. GUJARAT, INDIA.
    Posts
    13
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    In the context of the class Validator, we already have a method defined to adding new validators (add or addAllThese for multiple validators).
    add : function(className, error, test, options) {
    var nv = {};
    nv[className] = new Validator(className, error, test, options);
    Object.extend(Validation.methods, nv);
    },
    addAllThese : function(validators) {
    var nv = {};
    $A(validators).each(function(value) {
    nv[value[0]] = new Validator(value[0], value[1], value[2], (value.length > 3 ? value[3] : {}));
    });
    Object.extend(Validation.methods, nv);
    }

    I personally prefer to use addAllThese as it provides room for adding newer validators later rather than having to add one validator at a time.
    For the context of this tutorial, I’m going to add a new validator that simply returns true no matter what. (Just as an example)
    Let’s start by creating our own javascript file in our skin folder.

    Navigate to /skin/frontend/yourpackage/yourtheme/js/
    Create a new file: (e.g. myvalidator.js)

    In it, we can directly reference the Validator object, add our own validator to it.
    Validator.addAllThese([
    ['validate-yourvalidatorname', 'This is the error message. But we never return false, so you'll never see it.', function(v) {
    //Add your own validation code here
    return true; //For now, we'll just return true
    }]
    ]);

    In /app/design/frontend/yourpackage/yourtheme/layout/local.xml (if you don’t have one, create one), add your new js file in the “head” block.

    Now in any fields you’d like to use your validator in, you just add the class “validate-yourvalidatorname” to it and Validator will automatically validate your field using your new validation method.

Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •