Плавный переход из/в анимации alax загрузка к содержимому
Собственно проблема. Форма отправляется по ajax. Желательно все плавно скрыть и показать анимацию ajax загрузка. Когда придут данные проделать все в обратном порядке. Делал вот так:
function formgears(formid) { $(formid).ajaxSubmit({ beforeSubmit: function(){ $('#ajaxcontent').fadeOut(500); $('#ajaxload').fadeIn(500); }, success: function(text) { $('#ajaxload').fadeOut(500); $('#ajaxcontent').fadeIn(500); //die(); try { result = eval('(' + text + ')') errresult = result.error; switch (errresult) { case <?= ajax_ok ?>: $('#dialog').dialog('close'); document.location.reload(); break; case <?= ajax_okmessage ?>: messagebox(result.message, 'инфо'); case <?= ajax_error ?>: $('#ajaxcontent').html(result.errinfo); break; case <?= ajax_errorvalidation ?>: $(formid).validate().showErrors(result.errinfo); break; case <?= ajax_errormesage ?>: messagebox(result.errinfo, 'Ошибка'); break; case <?= ajax_permissiondenied ?>: break; } } catch (e) { messagebox (text, 'error'); } } //End succes }) return false; } Но вся проблема в том, что если данные приходят быстро все скрыться/отобразиться не успевает. Получается так: выводится ответ сервера (подсвечиваются поля с ошибкой) потом все это плавно переходит в анимацию, потом обратно. :) Не очень красиво и логично. Может кто-то сможет мне что-то подсказать. Пробовал скрывать/показывать по callback $('#ajaxcontent').fadeOut(500, function(){ $('#ajaxload').fadeIn(500); }) Выходит ещё хуже. Случается, что анимация так и не исчезает!!! |
Ужас, может начинать сначала с чего по проще :) А что у сервера запрашивает данный код?
|
$(formid).ajaxSubmit(......
|
вообщем поучиться надо на более простых запросах
|
Он отправляет форму. Адрес прописан в action form, в качестве данных передаёт значения полей.
А что, собственно не так? Пока на локали тестирую - получается, что div, содержащий форму не успевает окончательно скрыться, как данные уже приходят. Если в сервером коде делать задержку в 2 секунды(имитация время передачи на удалённый сервер) получается все красиво. Проблемы в приёме-передачи нет, проблема вот в этом Цитата:
|
Ну наверна надо остановить анимацию когда ответ приходит
$('#ajaxload').stop().fadeOut(500); $('#ajaxcontent').stop().fadeIn(500); |
$('#ajaxload').stop() а что это за метод такой интересный? И как можно остановить gif-ку? :) |
Цитата:
только я сомневаюсь на счёт правильно ли я написал код вот этот $('#ajaxload').stop().fadeOut(500); $('#ajaxcontent').stop().fadeIn(500); вот, в одной из соседних тем было fade.stop().fadeTo(500, 1);можно значит так сделать: $('#ajaxload').stop().fadeTo(500, 0); $('#ajaxcontent').stop().fadeTo(500, 1); |
$('#ajaxload').stop().fadeTo(500, 1);не работает. Ничего не отображается. Хотя $('#ajaxload').fadeIn(500);работает. Что не так? Может баг какой-то? |
Часовой пояс GMT +3, время: 21:25. |