Yii2 Scroll Pager with overflow scroll

[temirfe]

i have the same question as in here "when you set the scroll for a div, instead of the whole screen, ajax is not loading any additional items when you scroll down." I tried to use overflowContainer but with no luck.

[nicdnepr]

@temirfe did you solve this?

[omer-sds]

can you please share your code and output html

[omer-sds]

is used the following setting to initialize with ListView and it works fine, one thing, if you want infinite scroll throughout then use $listDataProvider->pagination->pageSize for the triggerOffset property

<?=
                ListView::widget ( [
                    'dataProvider' => $listDataProvider ,
                    'options' => [
                        'tag' => 'div' ,
                        'class' => 'list-wrapper' ,
                        'id' => 'list-wrapper' ,
                    ] ,
                    'itemOptions' => ['class' => 'col-sm-6 col-md-3' ] ,
                    'layout' => "{items}{pager}" ,
                    'pager' => [
                        'class' => \kop\y2sp\ScrollPager::className () ,
                        'container' => '#list-wrapper' ,
                        'item' => '.col-sm-6.col-md-3' ,
                        'paginationSelector' => '#list-wrapper>.pagination' ,
                        'next' => '.next a' ,
                        'historyPrev' => 'li.prev>a' ,
                        'noneLeftText' => 'No more Listings to display.' ,
                        'noneLeftTemplate' => '<div class="no-more col-sm-12"><span>{text}</span></div>' ,
                        'triggerText' => 'Load More Listings' ,
                        'triggerOffset' => $listDataProvider->pagination->pageSize,
                        'triggerTemplate' => '<div class="load-more"><a href="javascript:void(0)"><i class="zmdi zmdi-refresh-alt"></i> {text}</a></div>' ,
                    ] ,

[nicdnepr]

I use Gridview with default layout, with pager with param overflowContainer => '#w3'

<div id="w3" class="grid-view">
<table class="table table-striped table-bordered"></table>
<ul class="pagination hidden"></ul></div>

#w3 {
    height: 600px;
    overflow-y: scroll;
}

and pager not catch div overflow scroll, only catch global window scroll

[akshaymisal27]

@nicdnepr Did you find any solution for this?

[temirfe]

I'm sorry but it seems like Yii2 is slowly dying, consider switching to Laravel or smth. I'm thinking of switching to one of this alternatives: react or vue for frontend, node(expressjs) or python(django) for backend.

[ktropp]

I solved this by editing jquery-ias.js:624, $.ias function to this, dunno if this breaks ajax load not in overflow container:

  $.ias = function(option) {
    var $window = $(window);

    if($(option.container).length){
      $window = $(option.container);
    }

    return $window.ias.apply($window, arguments);
  };