We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

I want to click Progress button and continue to spin Progress until all the operations that are executed are processed.

I used the progress button, but when clicked, the progress is activated briefly and deactivated again after 1 to 2 seconds. What should I do?

<ejs-progressbutton id="testReceiveFromMMS" onclick="testFunction()" content="Contract" enableProgress="true" cssClass="e-success e-small"></ejs-progressbutton>
            function testFunction() {
                var btn = document.getElementById('testReceiveFromMMS').ej2_instances[0];
                btn.iconCss = 'e-btn-sb-icon e-pause';

                if (window.confirm("Do you want to receive new data from MMS?")) {
                    var jobNo = sessionStorage.getItem('JobKey');

                        url: "/MMSData/ReceiveFromMMS",
                        type: "POST",
                        data: { 'sJobNo': jobNo },
                        success: function (msg) {

                            btn.iconCss = 'e-btn-sb-icon e-play';
                        error: function (msg) {

                            btn.iconCss = 'e-btn-sb-icon e-play';

3 Replies

YA YuvanShankar Arunagiri Syncfusion Team December 9, 2022 12:08 PM UTC

Hi TaeWook,

Using the start and stop method, we can start and stop the progress. In your sample, please set the duration property to achieve your requirement. Please refer to the below code snippet and API link.

API link: https://ej2.syncfusion.com/javascript/documentation/api/progress-button/#duration

<ejs-progressbutton id="testReceiveFromMMS" content="Contract" enableProgress="true" iconCss="" duration="1000" created="created" end="end" cssClass="e-success e-small"></ejs-progressbutton>

Please refer the attached sample and get back to us if you need any further assistance on this.


YuvanShankar A

Attachment: Index_16890869.zip

TK TaeWook Kang December 16, 2022 07:11 AM UTC

I don't know how long my button works. It may take 10 seconds or 10 minutes. Is there any way to deal with it dynamically?

YA YuvanShankar Arunagiri Syncfusion Team December 19, 2022 12:47 PM UTC


To achieve your requirement, please set duration to the maximum value, and once your action is complete, using the progressComplete method, we can stop the progress/spinner of the progress button. Please refer to the below code snippet.

API link: https://ej2.syncfusion.com/javascript/documentation/api/progress-button/#progresscomplete

<ejs-progressbutton id="testReceiveFromMMS" content="Contract" enableProgress="true" duration="10000000" cssClass="e-success e-small"></ejs-progressbutton>


<ejs-button id="btn" cssClass="e-primary" content="Stop"></ejs-button>



    document.getElementById("btn").addEventListener('click', function () {

        var btn = ej.base.getComponent(document.querySelector("#testReceiveFromMMS"), "progress-btn");




Live Chat Icon For mobile
Up arrow icon