承接 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
  • 点击次数: 4
  • 依赖项目数: 0
  • 推荐数: 0

GitHub 信息

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

其他信息

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