Grid frozen when using an EjsProgressButton in a custom toolbar control

[Tom]

Good evening,

I've noticed that if I use a progress button in a grid toolbar (by following this guide https://ej2.syncfusion.com/blazor/documentation/grid/how-to/custom-control-in-grid-toolbar/), the whole grid becomes stuck like this (Infinitely spinning blue progress circle):

I'm on the latest version - 17.4.51 and here's my code (I've tried removing all animation settings etc. from the EjsProgressButton - still happens):

If I remove the EjsProgressButton or replace it with EjsButton - It works fine, so it's a compatibility issue with EjsProgressButton specifically.

Here's the JS error from the console:

Is there any way to have a ProgressButton inside a Grid Toolbar? 

(Possibly unrelated) The same EjsToolbar + EjsProgressButton works fine when it's not inside the EjsGrid, but then it's responsive mode is broken - When it's in the grid and I make the window smaller this works, outside the grid (but in the same div as the working responsive grid) it doesn't:

Thanks for your time,

Tom

[Renjith Singh Rajendran]

Hi Tom, 

Thanks for contacting Syncfusion support. 

We are able to reproduce the issue “Spinner shows in Grid, when having a EjsProgressButton in Custom toolbar”. We have confirmed this as a defect and logged a defect report for the same. Thank you for taking the time to report this issue and helping us improve our product. At Syncfusion, we are committed to fixing all validated defects (subject to technological feasibility and Product Development Life Cycle ) and including the fix in our upcoming bi-weekly patch release which is expected to be rolled out by the end of March,2020.  

 

You can now track the current status of your request, review the proposed resolution timeline, and contact us for any further inquiries through this link.  

Feedback Link : https://www.syncfusion.com/feedback/12428/spinner-shows-in-grid-when-having-a-ejsprogressbutton-in-custom-toolbar 

But we could not face the script error and the Grid renders with data loaded in it. Only the continuous showing of the spinner is the cause for the not responding behavior of Grid. If you hide the Grid’s spinner programmatically by applying the below style then you can click on the progress button and the Grid is not stuck. We have prepared a sample to based on this scenario by applying the below style to hide the spinner. Please download the sample from the link below, 

Sample : https://www.syncfusion.com/downloads/support/directtrac/general/ze/BlazorApp1-722737739 

 

Note : The below style is only for testing purpose. If that style is applied in your application, then Grid’s spinner or ProgressButton’s spinner won’t be displayed at any case(during initial grid load, or during any operation or during progress button click). So use the below style only for testing purpose. 

 

<style> 

    .e-grid .e-spinner-pane{    //hides the spinner in page(both Grid’s and ProgressButton’s spinner) 

        display:none; 

    } 

</style> 

 

If you still face the script error and data not loaded issues in Grid. Then we need more details to further proceed on these two issues(script error and data not loaded). Kinldy get back to us with the following details for better assistance. 

1. Share the sample which you have tried form your side. So that we could validate the problem with your sample and provide suggestion based on your scenario.
2. Share the complete Grid code. And the model code, which you have bound to Grid.

                                                                                                         

The provided information will help us analyze the problem, and provide you a solution as early as possible. 

Regards, 

Renjith Singh Rajendran. 

[Tom]

Hi Renjith,

Thanks for your response, I'm glad you were able to reproduce this - that's great to hear you're looking into it (however the Feedback Link below has error 404).

My Grid data loads once I use that CSS - but I still have the JS error.

I've been unable to reproduce the JS error in your sample so it must be something else with my code, I'll try to narrow it down.

Thanks for your time,

Tom

[Renjith Singh Rajendran]

Hi Tom, 

Thanks for your update. 

Query 1 : however the Feedback Link below has error 404). 

We are sorry for the inconvenience caused. The provided feedback link was under validation state. But, now we have moved the feedback to validated. We request you to kindly check now. 

Feedback link : https://www.syncfusion.com/feedback/12428/spinner-shows-in-grid-when-having-a-ejsprogressbutton-in-custom-toolbar 

 

Query 2 : so it must be something else with my code, I'll try to narrow it down. 

Thanks for your update. Please get back to us if you need any further assistance regarding this problem. 

Regards, 

Renjith Singh Rajendran.