jQuery - опрос очереди заданий - PullRequest
2 голосов
/ 02 февраля 2010

У меня есть таблица базы данных, которая содержит очередь заданий. Отдельная программа обрабатывает эти задания. Я хочу предоставить пользователям веб-страницу для наблюдения за ходом очереди. Сценарии на стороне сервера для запроса таблицы и ее возврата в формате JSON не являются проблемой.

Я немного читал о jQuery и плагине PeriodicalUpdater . Мне интересно, возможно ли вообще использовать этот плагин для создания визуальной очереди (базовое объяснение будет таблица из одного столбца, с строкой на запись в очереди), где завершенные задания удаляются на следующий время это опросы. Как я уже сказал, сценарий на стороне сервера не является проблемой, я просто не могу разобраться с подобным интерфейсом / анимацией. Буду признателен за любые советы по дальнейшему чтению, или, если я полностью ошибся, пожалуйста, дайте мне знать.

Заранее спасибо

Ответы [ 2 ]

8 голосов
/ 02 февраля 2010

Я не знаком с плагином PeriodicalUpdater, но на вашем месте я бы просто рассмотрел использование функции JavaScript setTimeout.setTimeout позволяет запускать функцию с заданным интервалом.

Пример, относящийся к вашей ситуации, см. здесь:

<script type="text/javascript">

setTimeout("updateTable();", 5000);

function updateTable()
{
     $.post("/your_script.php", {}, function(result) {

          $("#my_table").html(result);

     });
     setTimeout("updateTable", 5000);
}

</script>

Примечание. В одну секунду есть 1000 миллисекунд, поэтомуэта функция предназначена для отключения каждые 5 секунд.

Кроме того ...

Я предполагаю, что каждая запись в вашей таблице очередей имеет уникальный идентификатор, связанный с ней.На вашей основной HTML-странице я бы распечатал таблицу следующим образом:

<table>
<tr id='q1'><td>Queue Item 1</td></tr>
<tr id='q2'><td>Queue Item 2</td></tr>
<tr id='q3'><td>Queue Item 3</td></tr>
<tr id='q4'><td>Queue Item 4</td></tr>
<tr id='q5'><td>Queue Item 5</td></tr>
</table>

Другими словами, присвойте каждой строке в таблице очередей тот же идентификатор, что и запись в вашей таблице.Затем, когда ваш AJAX-вызов возвращает результат, вы можете проверить, завершен ли какой-либо из элементов очереди.Если они есть, вы можете сделать что-то вроде:

$("#q1").fadeOut("fast");
0 голосов
/ 02 февраля 2010

Вам не нужен длинный опрос. Вам просто нужен периодический вызов ajax для обновления очереди с помощью setInterval. Каждый раз, когда вы вызываете сервер, вы получаете всю существующую очередь, сравниваете ее с текущей и удаляете те, которые больше не присутствуют:

<script type="text/javascript">
var old_result = {};
setInterval(function(){
     $.post(YOUR_URL, {}, function(result) {
       //compare result with old_result
       //remove missing elements using an animation on that row
       //set old_result to result
     });
}), 5000);

</script>
...