DbHelp.ru
Маленький Yii блог
Комментарии
And with all of this amazing software for image reuopdrction more than half the shots I see posted o: And with all of this amazing software for image reuopdrction more than half the shots I see posted o...
Андрей: Добрый день, подскажите, а как этого зверя парсить?
With havin so much written content do you ever run into any problems of plagorism or copyright infri: With havin so much written content do you ever run into any problems of plagorism or copyright infri...
Гость: Спасибо)))
Анна: Спасибо большое! Очень хорошая статья. Все понятно даж...



Сервер Ultima Online - Forest Wars (от создателя данного блога)

Как добавить ajax preloader

Рубрика: Перевод Cookbook

Оцените эту статью:

Рейтинг: 0.00 (0)
9 Сен. 2009
Опубликовать в Twitter Написать в Facebook Опубликовать в своем блоге livejournal.com

Yii Framework Blog img http://dbhelp.rucookbook С Yii вы можете очень просто создавать ajax запросы. В большинстве случаев во время выполнения запроса, для наглядности, стоит показать картинку о том что он еще обрабатывается.

---

В этом уроке мы разберем простой пример вывода preloader картинки с помощью Yii + jQuery. Для всех данных внутри элемента который мы пытаемся обновить - мы установим прозрачность в 80% и отобразим картинку загрузки.

Достоинством этого решения является то, что вы не должны будите добавлять дополнительную разметку на ваши страницы.

При выполнении ajax запроса, добавляется .loading class для div элемента над которым мы работаем. После завершения запроса - класс автоматически будет снят с элемента. Это означает что вам не надо будет вручную удалять preloader и тп.

array(
'ajax' => array(
'beforeSend' => 'function(){
$("#myDiv").addClass("loading");
}
',
'complete' => 'function(){
$("#myDiv").removeClass("loading");
}
',
)
)

Это добавляем в ваш общий CSS файл:

div.loading {
background-color: #eee;
background-image: url('loading.gif');
background-position: center center;
background-repeat: no-repeat;
opacity: 1;
}
div.loading * {
opacity: .8;
}



Если хотите опубликовать этот материал у себя - пожалуйста, разместите ссылку на страницу откуда вы его взяли.
Другие yii статьи:

  1. Практически в каждом проекте мы сталкиваемся с тем что нам надо выводить даты. Это может быть все что угодно: ... "Выводим дату по человечески"

  2. Серия рецентов "By Example" пытается предоставить для разработчиков примеры использования самых распостраненных действий в Yii. Учимся использовать CHtml::link() на примерах! [+update ... ""By Example" : CHtml - link()"

  3. Я обычно часто просматриваю гугл сообщества в поисках чего-то нового (статьи, вопросы) и сам являюсь активным участником групп по ... "Сообщество Google"

[guest] mihdan

Было сказано: Среда, 09 Сентябрь 2009

Спасибо. Сам разбирался с данным вопросом, но до конца так и не добрел

[guest] Гость

Было сказано: Пятница, 25 Июнь 2010

сделал так - и никак рводе все но написаному:
$form_part = CHtml::dropDownList('city_id','0', $main_select,
array(
'ajax' => array(
'type'=>'POST',
'url'=>CController::createUrl('good/select1'),
'replace'=>'#s1',
'beforeSend' => 'function(){
$("#load_icon").addClass("loading");
}',
'complete' => 'function(){
$("#load_icon").removeClass("loading");
}',
)));

[guest] Гость

Было сказано: Пятница, 15 Июль 2011

CHtml::ajaxLink('Click me',
'', // Url
array('update'=>'.data',
'beforeSend' => 'function(){ $("#preload").addClass("loadFile");}',
'complete' => 'function() { $("#preload").hide(); }'));

<div id="preload"></div>

Оставить комментарий


Код:
Имя: