How to Run Onclick Automatically in button

Question

I'm trying to automatically run the onclick function in one button placed in phtml template.

This is the html file with the button code:

 <button type="button" id="review-btn" title="<?php echo $this->__('Place Order') ?>" class="button btn-checkout" onclick="review.save();"><span><span><?php echo $this->__('Place Orderxxxxx') ?></span></span></button>

This is part of javascript file with save and review functions:

//review function starts 
var Review = Class.create();
Review.prototype = {
    initialize: function(form,saveUrl,successUrl,agreementsForm){
        this.form = form;
        this.saveUrl = saveUrl;
        this.successUrl = successUrl;

        this.agreementsForm = agreementsForm;
        this.onSave = this.nextStep.bindAsEventListener(this);
        this.onComplete = this.resetLoadWaiting.bindAsEventListener(this);
    },
      //function triggers when onloading on review save function
    loadingbox: function () {
         var translate = Translator.translate('processing').stripTags();
        $("review-please").update(' <div class="please-wait-loading">&nbsp;</div><span class="load-wait">'+translate+'</span>')
    var form = $('review-btn');
    form.disabled='true';

    },

    save: function(){
 var paymentmethod = payment.currentMethod;
        var validator = new Validation(this.form);
        if (validator.validate()) {


            var request = new Ajax.Request(
                this.saveUrl,
                {
                    method:'post',
                    parameters: Form.serialize(this.form),
                    onLoading:this.loadingbox.bind(this),
                    onComplete: this.onComplete,
                    onSuccess: function(transport)    {
                        if(transport.status == 200)    {
                            var data = transport.responseText.evalJSON();
                            if(!data.success)
                            {
                                alert(data.error_messages);
                                $("review-please").update('');
                                 $('review-btn').disabled='';

                            }
                            if (data.redirect) {
                                location.href = data.redirect;
                                return;
                            }
                            if(data.success){
                               //hostedpro and advanced payment action
                                if(paymentmethod == 'hosted_pro' || paymentmethod =='payflow_advanced')
                                {
                                        Element.hide('review-please');
                                        Element.hide('review-btn');
                                        document.getElementById('checkout-paypaliframe-load').style.display= 'block';
                                        iframedata = data.update_section["html"].replace("display:none","display:block");
                                        document.getElementById('checkout-paypaliframe-load').innerHTML = iframedata;

                                }
                                else   //other payment action
                                {
                                    this.isSuccess = true;
                                    window.location = data.success;
                                }
                            }
                        }
                    },
                onFailure: checkout.ajaxFailure.bind(checkout)
            }
            );
    //var updater = new Ajax.Updater('product-details', this.saveUrl, {method: 'post',parameters: Form.serialize(this.form)});
    }
},

If I simply change the onclick to setTimeout it doesn't work.

instead on calling onClick you can directly use setTimeout(review.save(),10000); use this it will call function after some interval for more reference stackoverflow.com/a/11901175/4944490 — Krupesh Kotecha
– Krupesh Kotecha, Commented Oct 9, 2015 at 11:53

Rene Korss · Accepted Answer · 2015-10-09 13:09:26Z

3

Use setTimeout in your javascript file.

Second parameter is time in milliseconds (1000ms = 1s), after which function will be executed.

setTimeout(review.save, 1000);

EDIT:

Sinde you use this in your function, you need to overwrite this. If called independently, scope isn't same anymore.

setTimeout(function(){
    review.save.apply(document.getElementById('review-btn'));
}, 1000);

Full code

Add this to last row of your JS file.

window.onload = function(){
    setTimeout(function(){
        review.save.apply(document.getElementById('review-btn'));
    }, 1000);
};

edited Oct 9, 2015 at 13:09

answered Oct 9, 2015 at 11:48

Rene Korss

5,4943 gold badges33 silver badges39 bronze badges

Sign up to request clarification or add additional context in comments.

9 Comments

Jose Luis Over a year ago

Thank you but it doesn't work. It will not save anything.

Rene Korss Over a year ago

But it's calling function, right? I can't help you more, if you donät show more code. Saving is another topic.

Jose Luis Over a year ago

I don't know if calling function works cause there is no change on page. Page use ajax above this button, maybe this is the reason.

Rene Korss Over a year ago

Debug it then. Look in network tab, if AJAX gets called etc. Log wosmething to console etc. You really need to give me more information.

Jose Luis Over a year ago

Thank you for your interest. I will try to give you more information.

|

Collectives™ on Stack Overflow

How to Run Onclick Automatically in button

1 Answer 1

9 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

9 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related