PHPackages                             ksv2005/yii2-loading-overlay - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. ksv2005/yii2-loading-overlay

ActiveYii2-extension

ksv2005/yii2-loading-overlay
============================

Yii2 виджет-обертка для использования плагина jQuery LoadingOverlay

04.4k↓45.6%PHP

Since Aug 13Pushed 1y ago1 watchersCompare

[ Source](https://github.com/ksv2005/yii2-loading-overlay)[ Packagist](https://packagist.org/packages/ksv2005/yii2-loading-overlay)[ RSS](/packages/ksv2005-yii2-loading-overlay/feed)WikiDiscussions master Synced 1mo ago

READMEChangelogDependenciesVersions (1)Used By (0)

Yii2 виджет-обертка для [jQuery LoadingOverlay](https://gasparesganga.com/labs/jquery-loading-overlay/)
=======================================================================================================

[](#yii2-виджет-обертка-для-jquery-loadingoverlay)

[![Latest Stable Version](https://camo.githubusercontent.com/3e4cf00c4961deb16e2c7a6b178a0d743b4f17492402960d45c5619278befb5e/68747470733a2f2f706f7365722e707567782e6f72672f6b7376323030352f796969322d6c6f6164696e672d6f7665726c61792f762f737461626c65)](https://packagist.org/packages/ksv2005/yii2-loading-overlay)[![Latest Unstable Version](https://camo.githubusercontent.com/83a535beedaf9d3e030f8f690f1e11319856d330dda61694a28ee4285d331086/68747470733a2f2f706f7365722e707567782e6f72672f6b7376323030352f796969322d6c6f6164696e672d6f7665726c61792f762f756e737461626c65)](https://packagist.org/packages/ksv2005/yii2-loading-overlay)[![Total Downloads](https://camo.githubusercontent.com/b5af8241cb7ec4ab9a67dd8d890ef9d80d64fe53b86484baed9390e5ede44c75/68747470733a2f2f706f7365722e707567782e6f72672f6b7376323030352f796969322d6c6f6164696e672d6f7665726c61792f646f776e6c6f616473)](https://packagist.org/packages/ksv2005/yii2-loading-overlay)[![License](https://camo.githubusercontent.com/0093180ada5d0bb0766c68f3317bf4d47b0d7aec194d7255c322cb1d314ba5d8/68747470733a2f2f706f7365722e707567782e6f72672f6b7376323030352f796969322d6c6f6164696e672d6f7665726c61792f6c6963656e7365)](https://packagist.org/packages/ksv2005/yii2-loading-overlay)

Виджет предназначен для наложения картинки-лоадера на блок, при обработке Ajax запроса.

Скриншоты
---------

[](#скриншоты)

НаименованиеСкриншотНастройкиPjax с Gridview[![Pjax с Gridview](https://camo.githubusercontent.com/c68a7cb90e8d2f365706b3d7d3d70fde3a98294ded5e0a80f29b31becc7b562c/68747470733a2f2f6c68332e676f6f676c6575736572636f6e74656e742e636f6d2f35362d63425067516c755238694b4f3631506644786f724f4f774c4b512d6855715948445f55757736334c41335173594279506c4a6446333933575671306b5641487154466837765551473050324c5a376f614b756e394a303569596a42364a6d74755667644b4f4e4e674972414e367768656f526258684a497a7437503272596a4a426367)](https://camo.githubusercontent.com/c68a7cb90e8d2f365706b3d7d3d70fde3a98294ded5e0a80f29b31becc7b562c/68747470733a2f2f6c68332e676f6f676c6575736572636f6e74656e742e636f6d2f35362d63425067516c755238694b4f3631506644786f724f4f774c4b512d6855715948445f55757736334c41335173594279506c4a6446333933575671306b5641487154466837765551473050324c5a376f614b756e394a303569596a42364a6d74755667644b4f4e4e674972414e367768656f526258684a497a7437503272596a4a426367)'color'=> 'rgba(102, 255, 204, 0.2)', 'fontawesome' => 'fa fa-spinner fa-spin'Pjax с произвольным блоком[![Pjax с произвольным блоком](https://camo.githubusercontent.com/6d425c313a805ccaead8061ba7edb5d39d6af38286bdbda81d455a132758f198/68747470733a2f2f6c68332e676f6f676c6575736572636f6e74656e742e636f6d2f76725668686359423073542d39477845344a7837384b37586f4e3652683645343432734c31393049344776762d6530307a5434705368535a34524877666e655056684f71612d32525730655046314f635058516236596b684c37344b46717a66536174466f4a30474e5042644848593077477451414573455248747433515743583873716a77)](https://camo.githubusercontent.com/6d425c313a805ccaead8061ba7edb5d39d6af38286bdbda81d455a132758f198/68747470733a2f2f6c68332e676f6f676c6575736572636f6e74656e742e636f6d2f76725668686359423073542d39477845344a7837384b37586f4e3652683645343432734c31393049344776762d6530307a5434705368535a34524877666e655056684f71612d32525730655046314f635058516236596b684c37344b46717a66536174466f4a30474e5042644848593077477451414573455248747433515743583873716a77)'color'=> 'rgba(255, 102, 255, 0.3)'Демонстрация работы
-------------------

[](#демонстрация-работы)

[Demo страничка jQuery LoadingOverlay](https://gasparesganga.com/labs/jquery-loading-overlay/)

Установка
---------

[](#установка)

Запустить команду

```
php composer.phar require --prefer-dist ksv2005/yii2-loading-overlay "~1.0.0"
```

Добавить в секцию "require" файла composer.json:

```
{
    "require": {
        "ksv2005/yii2-loading-overlay": "~1.0.0"
    }
}
```

После добавления, выполнить команду: composer update

Использование
-------------

[](#использование)

Есть 2 способа использования:

### 1-й - просто подключаем jQuery LoadingOverlay к представлению

[](#1-й---просто-подключаем-jquery-loadingoverlay-к-представлению)

В представлении, где будет использоваться yii2-loading-overlay, подключить:

```
ksv2005\widgets\LoadingOverlayAsset::register($this);
```

Далее, использовать обычный JavaScript, для отображения/скрытия jQuery LoadingOverlay, руководствуясь [документацией jQuery LoadingOverlay](https://gasparesganga.com/labs/jquery-loading-overlay/), например так:

```

```

### 2-й - работа с Pjax

[](#2-й---работа-с-pjax)

Класс LoadingOverlayPjax, является расширением стандартного yii\\widgets\\Pjax и наследует все его поведение.

В представлении, где будет использоваться Pjax, подключить:

```
use ksv2005\widgets\LoadingOverlayPjax;
```

Использовать, вместо стандартного Pjax, "оборачивая" в него, например GridView (Скриншот 1):

```