Hide toolbar while is loading

Question

Hello,I know that probably my case is very specific, and is not a big problem, so the priority is low here.I am using a grid with toolbar buttons + querybuilder inside, but when I am loading the page, the grid with query builder load like the mov that I attached inside the zip file.Would be possible to don't show the elements while the grid is loading? Thank you very much.Attachment: mov_loading_grid_378a43f1.zip

Sujith Kumar Rajkumar · Accepted Answer

Hi Rafael, 
 
Greetings from Syncfusion support. 
 
Based on the provided information, we could understand that your requirement is to initially hide the EJ2 query builder component(rendered on the Grid toolbar) and then display it once the Grid rendering is completed. You can achieve this by setting the initial display CSS style as ‘none’ to the query builder element class(‘.e-query-builder’) and then changing the display back to ‘block’ in the Grid’s dataBound event as demonstrated in the below code snippets, 
 
app.component.css 




.e-query-builder { 
        display: none; 
} 
 
app.component.ts 




import { QueryBuilderComponent } from '@syncfusion/ej2-angular-querybuilder'; 
 
export class AppComponent { 
    @ViewChild('querybuilder') qryBldrObj: QueryBuilderComponent; 
 
    // Grid’s dataBound event handler 
    dataBound() { 
        // This event will be triggered each time the grid data is modified, so flag variable is used so that this case is executed only on Grid initial render 
        if (this.initialFlag) { 
            this.qryBldrObj.element.style.display = "block"; 
        } 
        this.initialFlag = false; 
    } 
} 
 
API link: https://ej2.syncfusion.com/angular/documentation/api/grid/#databound  
 
If we misunderstood your query or if you require any further assistance, then please get back to us. 
 
Regards, 
Sujith R

Rafael · Answer

Hi Sujith,It works! Thank you very very much!

Sujith Kumar Rajkumar · Answer

Hi Rafael, 
 
You’re welcome. We are glad to hear that the provided solution helped resolve your query. 
 
Please get back to us if you require any further assistance. 
 
Regards, 
Sujith R