Автообновление без перезагрузки страницы на Аяксе

[AGENT131313]

Доброго времени суток. Интерисует такой вопрос, есть страница на тей идет несколько таблиц <table> подскажите, как сделать автообновление через определенное время одного из table без перезагрузки страницы.
Обычное автообновление я знаю как сделать, а как совместить чтобы без перезагрузки страницы, чтобы просто подгружало?

И будет ли сильно грузить, если допустим сделать каждые 5 секунд?

 

[Extalionez]

Вообще плохо понял о чём вопрос.
Но смысл реализации подобного больше возложен на сервер, чем на JavaScript. Всё что тут от скрипта требуется так это по заданному интервалу (Для просмотра ссылки Войди или Зарегистрируйся) проверять сервер на обновления. В случае изменения данных таблицы - менять её. Способ реализации для минимальной загрузки сервера примерно следующий:
Каждые N секунд скрипт запрашивает минимальный JSON примерно следующим образом:
Отдаёт сессию на сервер, а сервер проверяет по своему кешу обновились ли данные в этой таблице. Если нет, то выдаёт {"changed": "false"}, ну а если изменялись то разумеется {"changed": "true"} + саму таблицу(полностью новую)+ новую сессию, а скрипт уже по новым данным обновляет таблицу.

 

[nethare]

Доброго времени суток. Интерисует такой вопрос, есть страница на тей идет несколько таблиц <table> подскажите, как сделать автообновление через определенное время одного из table без перезагрузки страницы.
Обычное автообновление я знаю как сделать, а как совместить чтобы без перезагрузки страницы, чтобы просто подгружало?

И будет ли сильно грузить, если допустим сделать каждые 5 секунд?

1. Пишете файл с логикой, скажем table_update1.php. В нем вы каким-то нужным Вам образом формируете таблицу. Отдаете ее обычным выводом, то есть echo().

/* Я не учитываю тут особенности движка на Вашем сайте. Возможно у вас каким-то хитрым образом работает вывод или файл должен называться как-то особенно */

2. Таблицу засуньте в контейнер, скажем вот так.

<div id='div_table1'>
  <table>...</table>
</div>.

3. Далее предположим, что у вас подключена jQuery.

4. Собственно скрипт:

$(document).ready(function(){
window.setInterval(function(){
  $('div#div_table1').load('http://mysite.com/table_update1.php');
}, 5000);
})

$.load() я использовал, потому что так писать меньше, и работает Если вам нравится, используйте полный $.ajax() с обработкой событий начала/конца или удачи/неудачи загрузки.

Грузить - в зависимости от того, что за таблица у вас, как долго она формируется, и.т.п. Браузер не будет сильно нагружен.

UPD:

Вообще плохо понял о чём вопрос.
Но смысл реализации подобного больше возложен на сервер, чем на JavaScript. Всё что тут от скрипта требуется так это по заданному интервалу (Для просмотра ссылки Войди или Зарегистрируйся) проверять сервер на обновления. В случае изменения данных таблицы - менять её. Способ реализации для минимальной загрузки сервера примерно следующий:
Каждые N секунд скрипт запрашивает минимальный JSON примерно следующим образом:
Отдаёт сессию на сервер, а сервер проверяет по своему кешу обновились ли данные в этой таблице. Если нет, то выдаёт {"changed": "false"}, ну а если изменялись то разумеется {"changed": "true"} + саму таблицу(полностью новую)+ новую сессию, а скрипт уже по новым данным обновляет таблицу.

Так будет совсем правильная архитектура. Пока писал свое, не видел, что написали Вы

 

[AGENT131313]

Вообще плохо понял о чём вопрос.
Но смысл реализации подобного больше возложен на сервер, чем на JavaScript. Всё что тут от скрипта требуется так это по заданному интервалу (Для просмотра ссылки Войди или Зарегистрируйся) проверять сервер на обновления. В случае изменения данных таблицы - менять её. Способ реализации для минимальной загрузки сервера примерно следующий:
Каждые N секунд скрипт запрашивает минимальный JSON примерно следующим образом:
Отдаёт сессию на сервер, а сервер проверяет по своему кешу обновились ли данные в этой таблице. Если нет, то выдаёт {"changed": "false"}, ну а если изменялись то разумеется {"changed": "true"} + саму таблицу(полностью новую)+ новую сессию, а скрипт уже по новым данным обновляет таблицу.

У меня не идет запрос к БД, все на файлах

Суть вопроса в том, что нужно перезагружать блок без перезагружки страницы кажые допустим 5 секунд

 

[Extalionez]

Ну у вас хоть php иль что-нить подобное есть на сервере? Файлы большие? Какой у них вообще формат? Сколько посетителей на сайте? Нужна жёсткая оптимизация или нет? С мобильников люди заходят на сайт?

 

[OctoRostov]

Куда же Вы без базы?))
Я обычно на jquery post использую:

        $.post(
  "/ajax/event-information.php",
  {
    id: me.octoID
  },
  onAjaxSuccess
);
 
function onAjaxSuccess(data)
{
  // Здесь мы получаем данные, отправленные сервером и выводим их на экран.
  eventInfo.innerHTML=data;
}

В event-information.php принимаете постом id а с помощью echo и всего html делаете ответ. Если таблиц несколько разных нужно проверять, то рассинхроньте таймеры для них, что б не все сразу обновлялись.

 

[a33]

без базы есть решение

 <script type="text/javascript">
                    /* <![CDATA[ */
                   
                        function showAdditional()
                        {
                              $("#additional").load('add.html?t=' + new Date().getTime());
                        }
                   
                      $(document).ready(function(){
                          showAdditional();
                              window.setInterval("showAdditional();", 30000);
                      })
                    /* ]]> */
                    </script>

Каждые 30 секунд
Ну там соответственно нужно jQuery подключить и <div id="additional"></div> создать для этого кода
Только штука опасная, мы сначала сделали на 5 сек интервал, и в первый день повесили сервер с 16Гб ОЗУ.

 

[nethare]

без базы есть решение

$("#additional").load('add.html?t=' + new Date().getTime());

Каждые 30 секунд
Ну там соответственно нужно jQuery подключить и <div id="additional"></div> создать для этого кода
Только штука опасная, мы сначала сделали на 5 сек интервал, и в первый день повесили сервер с 16Гб ОЗУ.

1. А что у ТС будет, простите вот тут: "add.html"? SSI сценарий? Пусть конкретнее обозначит, откуда у него данные обновляются и что там за данные.

2. Кстати да. У вас, очевидно, неплохое количество посещений было на ресурсе. Да и запросы не из самых легких, видимо.

 

[a33]

add.html - там внутри мы просто пишем любой html код, который должны увидеть пользователи.
На странице одновременно сидели 100-300 человек.

 

[nethare]

add.html - там внутри мы просто пишем любой html код, который должны увидеть пользователи.
На странице одновременно сидели 100-300 человек.

Я примерно понял Вашу идею. А зачем тогда время передавать параметром?

Осталось только выяснить, какие данные все-таки нужно обновлять ТСу.