Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 3901
  • Last Modified:

Carrying out two Javascript actions (Magento Checkout)

Hi guys,

I am trying to customise the Magento checkout.

On the Place Order button at the moment, I have an onclick="review.save()".  This successfully submits the form.

What I need to do though is try to do something along the lines of onclick="shippingMethod.save(); review.save()" = whereby, once it validates the Shipping Method it will then continue to submit the form.

Both work indepdently of each other, but not together.

So I am thinking that my checkout button will simply say onclick="shippingMethod.save();".  And in the Javascript (attached), there should be a way whereby, once it carries out the ShippingMethod class, it will move on to the Review class.

I just cannot get this to happen.  Any help would be really appreciated :)
var ShippingMethod = Class.create();
ShippingMethod.prototype = {
    initialize: function(form, saveUrl){
        this.form = form;
        this.saveUrl = saveUrl;
        this.validator = new Validation(this.form);
    },
 
    save: function(){
 
        if (checkout.loadWaiting!=false) return;
        
            checkout.setLoadWaiting('shipping-method');
            var request = new Ajax.Request(
                this.saveUrl,
                {
                    method:'post',
                }
            );
      
    }
 
};
 
//review and submit
var Review = Class.create();
 
Review.prototype = {
    initialize: function(saveUrl, successUrl, agreementsForm){
        this.saveUrl = saveUrl;
        this.successUrl = successUrl;
        this.agreementsForm = agreementsForm;
        this.onSave = this.nextStep.bindAsEventListener(this);
        this.onComplete = this.resetLoadWaiting.bindAsEventListener(this);
    },
 
    save: function(){
 
        if (checkout.loadWaiting!=false) return;
        checkout.setLoadWaiting('review');
        var params = Form.serialize(payment.form);
        if (this.agreementsForm) {
            params += '&'+Form.serialize(this.agreementsForm);
        }
        params.save = true;
        var request = new Ajax.Request(
            this.saveUrl,
            {
                method:'post',
                parameters:params,
                onComplete: this.onComplete,
                onSuccess: this.onSave,
                onFailure: checkout.ajaxFailure.bind(checkout)
            }
        );
    },
 
    resetLoadWaiting: function(transport){
        checkout.setLoadWaiting(false, this.isSuccess);
    },
 
    nextStep: function(transport){
        if (transport && transport.responseText) {
            try{
                response = eval('(' + transport.responseText + ')');
            }
            catch (e) {
                response = {};
            }
            if (response.redirect) {
                location.href = response.redirect;
                return;
            }
            if (response.success) {
                this.isSuccess = true;
                window.location=this.successUrl;
            }
            else{
                var msg = response.error_messages;
                if (typeof(msg)=='object') {
                    msg = msg.join("\n");
                }
                alert(msg);
            }
        }
    },
 
    isSuccess: false
}

Open in new window

0
SamDavis
Asked:
SamDavis
1 Solution
 
GregTSmithCommented:
It seems like you could simply call shippingMethod.save() as you suggest, and modify that function to call review.save when the asynchronous request is complete.

Something like:
save: function () {
  if (!checkout.loadWaiting) {
    checkout.setLoadWaiting('shipping-method');
    var request = new Ajax.Request(this.saveUrl, {
      method: 'post',
      onComplete: review.save
    });
  }
}

Open in new window

0
 
SamDavisAuthor Commented:
In the end I decided to stop trying to alter the processes within the Magento checkout - therefore I have reverted to the default layout.  I thought that by re-coding it, it would maybe make conversions higher, however due to the complexity of the checkout and the way it saves data - I have decided I would rather keep money coming in (albeit with a slightly less conversion rate) rather than not at all (with a dodgy checkout).
0

Featured Post

Important Lessons on Recovering from Petya

In their most recent webinar, Skyport Systems explores ways to isolate and protect critical databases to keep the core of your company safe from harm.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now