Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > JavaScript: для новичков > Индикатор выполнения скрипта

Автор: serezhka1986 22.12.2011, 14:57

Есть скрипт, который отправляет POST-запрос с помощью AJAX. Как сделать индикатор выполнения php-скрипта до вывода его результата в div. Проще говоря, чтобы пока выполнялся скрипт показывалась картинка user posted image

Вот скрипт отправки запроса:

Код


function selectweekfilter(){
        var id_year = $('select[name="yearfilterselect"]').val();
        if(!id_year){
                $('div[name="selectweek"]').html('');
        }else{
                $.ajax({
                        type: "POST",
                        url: "/includes/weekfilter.php",
                        data: "id_year="+id_year,
                        cache: false,
                        success: function(responce){ $('div[name="selectweek"]').html(responce); }
                });
        };
};

Автор: Leshak 22.12.2011, 15:11

если просто, то
- одновременно с отправкой запроса - визуализируйте картинку с анимацией
- по получению данных с сервера - спрячьте ее обратно

    function ShowLoad(j) {  //  - крутим картинку - идет загрузка
        if ( j == 1 )
             {    showLoad.style.visibility = 'visible' ; showLoad.style.zIndex = 11 ;    }
        else {    showLoad.style.visibility = 'hidden' ; showLoad.style.zIndex = -10 ;    }
    }  ;

Автор: $дмитрий 22.12.2011, 19:21

Используй метод beforeSend для показа картинки, а при вызове success скрывай/удаляй

Автор: serezhka1986 23.12.2011, 10:14

Реализовал так:

Код


function selectweekfilter(){
        var id_year = $('select[name="yearfilterselect"]').val();
        if(!id_year){
                $('div[name="selectweek"]').html('');
        }else{
      $('img#loadicon').css("visibility", "visible");
                $.ajax({
                        type: "POST",
                        url: "/includes/weekfilter.php",
                        data: "id_year="+id_year,
                        cache: false,
                        success: function(responce){ $('div[name="selectweek"]').html(responce); $('img#loadicon').css("visibility", "hidden");}
                });
        };
};

Всем спасибо! smile