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 http://stackoverflow.com/a/11901175/4944490 — Krupesh Kotecha, Oct 09 '15 at 11:53

Rene Korss · Accepted Answer · 2015-10-09T13:09:26.700

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 09 '15 at 13:09

answered Oct 09 '15 at 11:48

Rene Korss

5,414
3
31
38

Thank you but it doesn't work. It will not save anything. – Jose Luis Oct 09 '15 at 12:06
But it's calling function, right? I can't help you more, if you donät show more code. Saving is another topic. – Rene Korss Oct 09 '15 at 12:07
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. – Jose Luis Oct 09 '15 at 12:11
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. – Rene Korss Oct 09 '15 at 12:12
Thank you for your interest. I will try to give you more information. – Jose Luis Oct 09 '15 at 12:15
I've just updated the post with more information. thank you. – Jose Luis Oct 09 '15 at 12:24
Edited my answer. Try again. – Rene Korss Oct 09 '15 at 12:42
Thank you.Can you please paste the full code? I'm not a developer... thanks. – Jose Luis Oct 09 '15 at 13:04
Add this full code to your JS file. Don't edit your `button`. – Rene Korss Oct 09 '15 at 13:10

How to Run Onclick Automatically in button

1 Answers1