0

Здравствуйте, делаю небольшое тестовое задание , для прогрессбара juery (http://jqueryui.com/progressbar/) сделал несколько кнопок управления "Старт/Продолжить", "Стоп" и "Сбросить". Написал несколько функций (немного переделав примеры кода на Jquery UI) в конечном итоге должно получиться что-то типа таск менеджера, выглядит всё вот так (http://job.maler1988.tmweb.ru/test/?clear_cache=Y):

HTML код:

<div class="progressbur-containr" >
    <div class="status" ></div>
    <div class="progressbar" id="progressbar" >
        <div class="progress-label">Process created...</div>
    </div>

    <br/>

    <button class="process-start" >Старт</button>
    <button class="process-stop" >Стоп</button>
    <button class="progress-reset" >Сбросить</button>
</div>

Это отрабатывает в после загрузки документа (document.ready):

 var progressbar = $("#progressbar"),
 progressLabel = $(".progress-label");
 progressbar.progressbar({
        value: false,
     change: function() {
        progressLabel.text( progressbar.progressbar( "value" ) + "%" );
     },
     complete: function() {
        progressLabel.text( "Complete!" );
     }
 });

затем функция создающая "анимацию"

 function progress() {
     var val = progressbar.progressbar( "value" ) || 0;
     var disabled = progressbar.progressbar( "option", "disabled" );

     if(disabled!=true)
        {
            progressbar.progressbar( "value", val + 1 );
        }
     if ((val < 99)&&(disabled!=true) ) 
        {
            setTimeout( progress, 1000 );
        }                   
 }

она сама себя перезапускает, по этому поводу тоже будет вопрос. Затем остановка процесса:

function stopProgress() {
            progressbar.progressbar("disable");
            $(".process-start").text("Продолжить");
     };

и перезапуск:

 function resetProgress() {
        progressbar.progressbar( "value", 0 );
        progressbar.progressbar("enable");
        $(".process-start").text("Старт");
        progressLabel.text( "Process reset!" );
 }

Для кнопок на форме я через события jquery создал обработчики:

$(".process-start").click(function(){
        progressbar.progressbar("enable");
        setTimeout(progress,100);
    });

    $(".process-stop").click(function(){
        setTimeout(stopProgress,100);
    });

    $(".progress-reset").click(function(){
        setTimeout(resetProgress,100);
    });

Я хочу теперь записывать всё в БД , т.е. состояние процесса, процент выполнения и т.п. Как это лучше организовать? Ajax JSON? Jquery Ajax? Процессов на странице может быть несколько (естествнно для этого приведённый набор функций будет доработан).

6
  • > записывать всё в БД , т.е. состояние процесса, процент выполнения и т.п. 1. Вы хотите, в том числе, и при каждом изменении значения прогрессбара (т.е. каждую секунду) делать запись в БД или обновление существующей записи? 2. Да, если вам нужно производить эти действия без перезагрузки страницы, то Ajax. Ну, в крайнем случае, через iframe.
    – Deonis
    19 июл 2014 в 13:04
  • я думаю каждую секунду напряжно будет для сервера, привязать хотел какой-нибудь update ко всем кнопкам, т.е. запустил, остановил, продолжил + перехватывать попытку пользователя закрыть страницу или обновить, при этом спрашивать подтверждение, и записывать текущее состояние прогрессбара пока страница не закрылась.
    – maler1988
    19 июл 2014 в 13:10
  • По повотду закрытия страницы, например, [beforeunload][1]. С остальным не должно возникнуть проблем. Или у вас сложность именно с Ajax-запросами? [1]:developer.mozilla.org/en-US/docs/Web/API/Window.onbeforeunload
    – Deonis
    19 июл 2014 в 13:20
  • нет с Ajax я нормально работаю, просто хотел узнать может есть какой-то супер простой способ организации такого интерфейса. )
    – maler1988
    19 июл 2014 в 13:26
  • @maler1988, "супер простой способ организации" зависит уже от вас. Хотя, может и есть функция magic_wand(), которая телепатически угадывает чего вы хотите и быстренько это реализует, но пока я такой не встречал ;)
    – Deonis
    19 июл 2014 в 13:45

1 ответ 1

1

А нужно ли вам сохранять это на сервер, чтобы просто воспроизвести состояние прогресс бара после перезагрузки страницы? Почему бы не сохранять его в LocalStorage например?

1
  • та нет тут нужно будет чтобы потом администратор мог что-то править и пр.
    – maler1988
    21 июл 2014 в 13:26

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.