https://github.com/nirvana-msu/yii2-infinite-scroll

Yii2 extension for infinite-scroll jQuery plugin
https://github.com/nirvana-msu/yii2-infinite-scroll

infinite-scroll-plugin php yii2-extension

Last synced: 3 months ago
JSON representation

Yii2 extension for infinite-scroll jQuery plugin

• Host: GitHub
• URL: https://github.com/nirvana-msu/yii2-infinite-scroll
• Owner: nirvana-msu
• License: mit
• Archived: true
• Created: 2015-01-20T22:56:27.000Z (almost 10 years ago)
• Default Branch: master
• Last Pushed: 2019-04-18T04:44:18.000Z (over 5 years ago)
• Last Synced: 2024-09-18T22:33:00.323Z (3 months ago)
• Topics: infinite-scroll-plugin, php, yii2-extension
• Language: PHP
• Homepage:
• Size: 14.6 KB
• Stars: 32
• Watchers: 7
• Forks: 19
• Open Issues: 6
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
yii2-infinite-scroll

================

Yii2 extension for infinite-scroll jQuery plugin, providing scrolling functionality for widgets such as `ListView`.

It renders a hyperlink that leads to subsequent page of a target and registers 

infinite-scroll jQuery plugin which uses javascript to fetch and append content for subsequent pages,

gracefully degrading to complete page reload when javascript is disabled.

Several behaviours allowing to customize scroll behavior are provided out of the box,

including twitter-style manual trigger, local scroll in overflow div, masonry integration and others.

At the moment this extention only supports v2.x of infinite-scroll plugin.

## Resources

 * Yii2 [extension page](http://www.yiiframework.com/extension/yii2-infinite-scroll)

 * Infinite-Scroll jQuery plugin [documentation](https://github.com/paulirish/infinite-scroll)

## Installation

### Composer

Add extension to your `composer.json` and update your dependencies as usual, e.g. by running `composer update`

```js

{

    "require": {

        "nirvana-msu/yii2-infinite-scroll": "1.0.*@dev"

    }

}

```

## Widget Configuration

In addition to most of the properties that `LinkPager` provides, this widget also allows you to configure:

 

 * $widgetId *string* owner widget id, required

 * $itemsCssClass *string* CSS class of a tag that encapsulates items, required

 * $pluginOptions *array* infinite-scroll jQuery plugin options. For more information refer to infinite-scroll [documentation](https://github.com/paulirish/infinite-scroll)

 * $contentLoadedCallback *string|JsExpression* javascript callback to be executed on loading the content via ajax call

  

## Sample Usage

Plugin works by appending fetched items to the end of parent container, so it is required

to configure `layout` property of parent `ListView` widget, wrapping `{items}` into e.g. `div` container with some class (to be used as a selector).

It is possible to configure all selectors that widget initializes plugin with to fit your project requirements, but it general it is enough to

set `itemCssClass` (class of that wrapping tag that we created) and `widgetId` (which would ensure multiple plugins on the same page would not conflict).

So the minimal required configuration would look like this:

```php

echo ListView::widget([

    ...

    'id' => 'my-listview-id',

    'layout' => "{summary}\n
{items}
\n{pager}",

    'pager' => [

        'class' => InfiniteScrollPager::className(),

        'widgetId' => 'my-listview-id',

        'itemsCssClass' => 'items',

    ],

]);

```


An example illustrating how to customize some widget / plugin options: 

```php

echo ListView::widget([

    ...

    'id' => 'my-listview-id',

    'layout' => "{summary}\n
{items}
\n{pager}",

    'pager' => [

        'class' => InfiniteScrollPager::className(),

        'widgetId' => 'my-listview-id',

        'itemsCssClass' => 'items',

        'contentLoadedCallback' => 'afterAjaxListViewUpdate',

        'nextPageLabel' => 'Load more items',

        'linkOptions' => [

            'class' => 'btn btn-lg btn-block',

        ],

        'pluginOptions' => [

            'loading' => [

                'msgText' => "Loading next set of items...",

                'finishedMsg' => "No more items to load",

            ],

            'behavior' => InfiniteScrollPager::BEHAVIOR_TWITTER,

        ],

    ],

]);

```


## License

Extension is released under MIT license, same as underlying jQuery plugin.