load page when scrolling awesome grid - infinite scrolling/endless paging

Title:

BI{code} ?

Hello, Thanks for all previous reply. When user will scroll down in the awesome grid, system will bind next record some records into awesome grid. when user will up scroll in the awesome grid, system will bind previous some record into awesome grid. or When user will scroll down in the awesome grid, system will bind next page records into awesome grid. when user will up scroll in the awesome grid, system will bind previous page record into awesome grid. can you say how can do it ?

Save Changes Cancel

asked at 02 Jan 2015

Answers

• BI{code} ?

  *UPDATE:* there's a demo for this now: http://demo.aspnetawesome.com/GridInfiniteScrollingDemo hi, you're welcome, this will make all your grids have infinite paging: $(function () { $('.awe-grid .awe-content').on('scroll', function () { var $this = $(this); var $grid = $this.closest('.awe-grid'); var res = $grid.data('api').getResult(); var sv = $this.scrollTop(); var sh = $this.prop('scrollHeight') - $this.innerHeight(); var lsv = $this.data('lastsv'); if ((lsv + 1) == sh && sv == sh) { if (res.Page < res.PageCount) { $.when(nextPage()).done(function () { $this.scrollTop(1); sv = 1; }); } } else if (sv == sh) { sv--; $this.scrollTop(sv); } else if ((lsv - 1) == 0 && sv == 0) { if (res.Page > 1) { $.when(prevPage()).done(function () { sv = sh - 1; $this.scrollTop(sv); }); } } else if (sv == 0) { sv++; $this.scrollTop(sv); } $this.data('lastsv', sv); function nextPage() { return $grid.data('api').load({ oparams: { page: res.Page + 1 } }); } function prevPage() { return $grid.data('api').load({ oparams: { page: res.Page - 1 } }); } }); }); to make sure you always have scrollbar regardless of number of rows you can use this css: .awe-tablw{ min-height:500px /* change the number as per your case */ } of course if you need this just for certain grids you can add a css class to those grids (.CssClass("myclass")) and css will be .myclass .awe-tablw {...} you could also increase your page size, g.PageSize in controller or .PageSize() in view

  Save Changes Cancel

  

  Omu

  answered at 02 Jan 2015

please Sign In to leave an answer