定制 timurmelnikov/yii2-showloading 二次开发

按需修改功能、优化性能、对接业务系统,提供一站式技术支持

邮箱:yvsm@zunyunkeji.com | QQ:316430983 | 微信:yvsm316

timurmelnikov/yii2-showloading

最新稳定版本:0.1.2

Composer 安装命令:

composer require timurmelnikov/yii2-showloading

包简介

Yii2 расширение для подключения плагина jQuery showLoading

README 文档

README

Yii2 расширение для подключения плагина jQuery showLoading
Расширение предназначено для наложения картинки Ajax загрузки на блок, при обработке Ajax запроса.

Это расширение, больше не поддерживаю! Рекомендую использовать - Yii2 виджет-обертка для jQuery LoadingOverlay

Демонстрация работы

Demo страничка плагина

Установка

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

{
    "require": {
        "timurmelnikov/yii2-showloading": "dev-master"
    }
}

После редактирования файла выполнить команду composer update

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

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

use timurmelnikov\widgets\ShowLoading;

Вывести виджет:

echo ShowLoading::widget(['loadingType' => 1]);

Свойство 'loadingType' отвечает за картину Ajax загрузки. Есть возможность использовать значения от 1 до 5. В зависимости от значения будет выводиться различная картинка Ajax загрузки.

В коде javaSctipt, который обрабатывает Ajax запрос использовать методы - showLoading() и hideLoading() для показа и скрытия картинки Ajax загрузки соответственно:

$('#id-блока').showLoading();
//Обработка Ajax запроса...
$('#id-блока').hideLoading();

Прммер использования:

//Контейнер, ктоторый будет "накрывть" индикатор загрузки
<div id="test"></div>

<?php
//Кнопки 
echo Html::button('Показать индикатор', ['class' => 'btn btn-primary', 'id' => 'show-button']);
echo Html::button('Скрыть индикатор', ['class' => 'btn btn-primary', 'id' => 'hide-button']);

//Вызов виджета индикатора
echo ShowLoading::widget(['loadingType' => 1]);

//Код JavaScript
$script = <<<JS
//Показать индикатор        
$('#show-button').click(function () {
    $('#test').showLoading();
});
//Скрыть индикатор       
   $('#hide-button').click(function () {
    $('#test').hideLoading();
});
JS;

//Подключение JavaScript
$this->registerJs($script);

统计信息

  • 总下载量: 208
  • 月度下载量: 0
  • 日度下载量: 0
  • 收藏数: 1
  • 点击次数: 0
  • 依赖项目数: 0
  • 推荐数: 0

GitHub 信息

  • Stars: 1
  • Watchers: 1
  • Forks: 0
  • 开发语言: JavaScript

其他信息

  • 授权协议: MIT
  • 更新时间: 2015-05-28