Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 15.02.2010, 14:14
Интересующийся
Отправить личное сообщение для ekkl Посмотреть профиль Найти все сообщения от ekkl
 
Регистрация: 16.10.2009
Сообщений: 29

Плавный переход из/в анимации 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);
})

Выходит ещё хуже. Случается, что анимация так и не исчезает!!!
Ответить с цитированием
  #2 (permalink)  
Старый 15.02.2010, 16:05
Аватар для sysya
Профессор
Отправить личное сообщение для sysya Посмотреть профиль Найти все сообщения от sysya
 
Регистрация: 27.12.2009
Сообщений: 292

Ужас, может начинать сначала с чего по проще А что у сервера запрашивает данный код?
__________________
Нет предела совершенству...
Ответить с цитированием
  #3 (permalink)  
Старый 15.02.2010, 16:09
Интересующийся
Отправить личное сообщение для ekkl Посмотреть профиль Найти все сообщения от ekkl
 
Регистрация: 16.10.2009
Сообщений: 29

$(formid).ajaxSubmit(......
Ответить с цитированием
  #4 (permalink)  
Старый 15.02.2010, 16:14
Аватар для sysya
Профессор
Отправить личное сообщение для sysya Посмотреть профиль Найти все сообщения от sysya
 
Регистрация: 27.12.2009
Сообщений: 292

вообщем поучиться надо на более простых запросах
__________________
Нет предела совершенству...

Последний раз редактировалось sysya, 15.02.2010 в 16:22. Причина: изменить
Ответить с цитированием
  #5 (permalink)  
Старый 15.02.2010, 16:24
Интересующийся
Отправить личное сообщение для ekkl Посмотреть профиль Найти все сообщения от ekkl
 
Регистрация: 16.10.2009
Сообщений: 29

Он отправляет форму. Адрес прописан в action form, в качестве данных передаёт значения полей.
А что, собственно не так?
Пока на локали тестирую - получается, что div, содержащий форму не успевает окончательно скрыться, как данные уже приходят. Если в сервером коде делать задержку в 2 секунды(имитация время передачи на удалённый сервер) получается все красиво.
Проблемы в приёме-передачи нет, проблема вот в этом
Цитата:
Но вся проблема в том, что если данные приходят быстро все скрыться/отобразиться не успевает.
Ответить с цитированием
  #6 (permalink)  
Старый 15.02.2010, 16:27
Аватар для sysya
Профессор
Отправить личное сообщение для sysya Посмотреть профиль Найти все сообщения от sysya
 
Регистрация: 27.12.2009
Сообщений: 292

Ну наверна надо остановить анимацию когда ответ приходит
$('#ajaxload').stop().fadeOut(500);
$('#ajaxcontent').stop().fadeIn(500);
__________________
Нет предела совершенству...

Последний раз редактировалось sysya, 15.02.2010 в 16:32. Причина: добавить
Ответить с цитированием
  #7 (permalink)  
Старый 15.02.2010, 16:33
Интересующийся
Отправить личное сообщение для ekkl Посмотреть профиль Найти все сообщения от ekkl
 
Регистрация: 16.10.2009
Сообщений: 29

$('#ajaxload').stop()

а что это за метод такой интересный?
И как можно остановить gif-ку?
Ответить с цитированием
  #8 (permalink)  
Старый 15.02.2010, 16:35
Аватар для sysya
Профессор
Отправить личное сообщение для sysya Посмотреть профиль Найти все сообщения от sysya
 
Регистрация: 27.12.2009
Сообщений: 292

Сообщение от ekkl Посмотреть сообщение
$('#ajaxload').stop()

а что это за метод такой интересный?
И как можно остановить gif-ку?
он останавливает анимацию элемента #ajaxload, у него анимация происходит исчезновение...
только я сомневаюсь на счёт правильно ли я написал код вот этот
$('#ajaxload').stop().fadeOut(500); 
$('#ajaxcontent').stop().fadeIn(500);


вот, в одной из соседних тем было
fade.stop().fadeTo(500, 1);
можно значит так сделать:
$('#ajaxload').stop().fadeTo(500, 0); 
$('#ajaxcontent').stop().fadeTo(500, 1);
__________________
Нет предела совершенству...

Последний раз редактировалось sysya, 15.02.2010 в 16:41. Причина: добавить
Ответить с цитированием
  #9 (permalink)  
Старый 17.02.2010, 12:47
Интересующийся
Отправить личное сообщение для ekkl Посмотреть профиль Найти все сообщения от ekkl
 
Регистрация: 16.10.2009
Сообщений: 29

$('#ajaxload').stop().fadeTo(500, 1);
не работает. Ничего не отображается. Хотя
$('#ajaxload').fadeIn(500);
работает. Что не так?
Может баг какой-то?
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Плавный переход по страницам cyberx Общие вопросы Javascript 118 05.03.2011 13:57