kop/yii2-scroll-pager + masonry


I’m trying to make masonry work with kop/yii2-scroll-pager extension. Tried several ways but with no luck.

My code:


echo ListView::widget([

'dataProvider' =&gt; &#036;dataProvider,

'itemOptions' =&gt; ['class' =&gt; 'grid-item'],

'itemView' =&gt; '_item_view',

'options' =&gt; ['class' =&gt; 'grid'],

'pager' =&gt; [

    'class' =&gt; ScrollPager::className(),

    'item' =&gt; '.grid-item',

    'container' =&gt; '.grid',


        'enabledExtensions' =&gt; ['EXTENSION_HISTORY' =&gt; false],



I tried to add there:

‘eventOnRender’ => new JsExpression(’\function(items) {\$(".grid").masonry({itemSelector: “.grid-item”, columnWidth: 300, gutter: 5 });’),

but masonry doesn’t work.

if I put:


itemSelector: ".grid-item",

columnWidth: 300,

isAnimated: true,

gutter: 5


then only first page is appears as masonry applied but then it loads just as one column.

Please advise what do I do wrong.