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
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to determine the duration of spinner in a ProgressButton?

Thread ID:





143056 Mar 2,2019 04:44 AM UTC Mar 26,2019 07:12 AM UTC Angular - EJ 2 5
Tags: Grid
Asked On March 2, 2019 04:44 AM UTC


I have an input text and a progress button. I enter something in the input and when I press Enter button on keyboard or when I click on the ProgressButton itself, program should send a request to get some data. and the spinner on the ProgressButton should spin until the data arrives. but I don't know how to tell the spinner when to stop. sometimes it stops sooner than it should and sometimes the data arrives immediately and the spinner still spinning.
so what is the solution?

Silambarasan I [Syncfusion]
Replied On March 6, 2019 01:34 AM UTC

Hi Nastaran, 
Thank you for contacting Syncfusion support. 
We have checked your requirement “To stop progress programmatically when the data is received” and it can be achievable by using progress event of Progress Button. In the below sample, the Progress Button will spin until the “Stop Progress” button is clicked. Please check the below code snippet, 
<button ejs-progressbutton #progressButton content="Spin Left" (progress)='onProgress($event)'></button> 
<button ejs-button content="Stop Progress" (click)="btnClick()"></button> 
export class ProgressButtonController { 
    @ViewChild('progressButton') progressButton: ProgressButtonComponent; 
    public isDataArrived: boolean = false; 
    public onProgress(args: ProgressEventArgs){ 
            //To stop the spinner 
            args.percent = 100; 
            this.isDataArrived = false; 
        else { 
            //Duration will be increased if button is not clicked 
            this.progressButton.duration = this.progressButton.duration + 1000; 
        this.isDataArrived = true; 
Could you please check the above sample and get back to us with more information if we misunderstood your requirement or you need any further assistance? 

Replied On March 16, 2019 08:05 AM UTC

thanks. it worked.
why Microsoft Edge and IE doesn't show the spinner?

Silambarasan I [Syncfusion]
Replied On March 18, 2019 09:00 AM UTC

Hi Nastaran, 
Thanks for your update. 
We have checked your reported issue in Microsoft Edge & IE browser’s and the spinner shows properly in our end. For your convenience, we have prepared the video demonstration for this.  
Please find video from the link below. 
However, we would like to let you know the following details. 
1. Please provide your Edge and IE browsers version details
2. Please share us the more details or video demonstration of your issue. If possible, please replication your issue in the provided stackblitz sample and revert to us. 
3. Please share us your Essential studio product version that you are currently using. 
Could you please check the above video demonstration and get back to us with the more information along with the above-mentioned details? So that, we can analyze based on that and provide you a solution at the earliest. 

Replied On March 26, 2019 03:42 AM UTC

Hi. Thanks for your reply.
yes the spinner in progress button is displayed in all browsers.
maybe I should have asked this in another issue. I use a spinner in a grid before the data is loaded. Chrome and Firefox display the spinner but in Edge and IE they don't show the spinner. I use Edge 16 and IE11.

Pavithra Subramaniyam [Syncfusion]
Replied On March 26, 2019 07:12 AM UTC

Hi Nastaran, 

Thanks for your Update. 

Query : Chrome and Firefox display the spinner but in Edge and IE they don't show the spinner. I use Edge 16 and IE11. 
We have analyzed your query but we are unable to reproduce the reported issue at our end. So please provide the below information for us, it will help us provide a better solution as soon as possible, 

  1. Please share the exact steps/scenario to reproduce your issue?
  2. Please share you full grid code sample?
  3. Please share grid package version details?
  4. Could you please try to reproduce the reported issue in the below provided sample?

Please get back to us for further assistance. 
Pavithra S. 


This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon