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. (Last updated on : Nov 16th 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Load Grid On Scroll

Thread ID:

Created:

Updated:

Platform:

Replies:

127218 Nov 3,2016 10:05 AM UTC Nov 4,2016 11:49 AM UTC Angular 1
loading
Tags: ejGrid
Aniruddha Pondhe
Asked On November 3, 2016 10:05 AM UTC

I have a page with 4-5 grids and many fields. So there is a considerable scroll introduced in the page.

Using Angular2 how can I trigger loading of the grids on scroll - that is only when the grids come into view.

Do you have support for the same? Is there any existing events in the ejGrid which I can use to trigger loading of grids only when they come in view?


Karthick Kuppusamy [Syncfusion]
Replied On November 4, 2016 11:49 AM UTC

Hi Aniruddha, 

Thanks for Contacting Syncfusion support. 

We can achieve your requirement by using bootstrap ScroppSpy plugin. The ScrollSpy plugin is specifically used for updating the targets based on scroll position when using bootstrap themes. If you are referring the bootstrap theme and scripts then you can render the grids in on demand basis using ScrollSpy while scrolling the page. 

Please refer the documentation link. 

If you rendering the grids with empty data and then bind the grid data while scrolling  , the “dataBound “event will be triggered for the corresponding grid. 

Please find the code example for trigger the databound event. 

Template  
 
 
<ej-grid . . . (dataBound)="ondataBound ($event)">  
        <e-columns>  
            <e-column field="OrderID" headerText="Order ID" width="75"textalign="right"></e-column>  
. .   
        </e-columns>  
</ej-grid>  
  
Component  
 
 
@Component({  
    . . . .   
   directives: [EJ_GRID_COMPONENTS, CORE_DIRECTIVES],  
    . . .   
})  
export class DefaultComponent {  
    . . . .  
    ondataBound (e: any){  
                    //Do something;  
    }  
}  
  
Please find the UG Link for Your reference. 

Note : in dataBound event we get the grid id through “this._id” 

Please let us know if you need further assistance. 

Regards, 
K.Karthick. 


CONFIRMATION

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.

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

;