Как обновить часть страницы с интервалом

Question

У меня есть страница, которая над ней. Я хочу, чтобы панель автоматически обновлялась каждые 5 минут, и если у пользователя есть сообщение в его почтовом ящике, покажите ему. Какое лучшее решение для этого?

Должен ли я использовать AJAX, jQuery или JavaScript? Мое предпочтительное решение - решение на стороне сервера.

Answer 1

Поскольку вы работаете с ASP.Net, вы можете также достичь такого поведения, используя комбинацию из следующих действий:

1. ScriptManager или ScriptManagerProxy (если вложенные страницы): Управляет Ajax звонки
2. UpdatePanel: Определяет Что обновляет. Элементы управления вложенными в <ContentTemplate> подлежат частичных обновлений
3. Triggers: Управляет когда содержание обновляется.

Для вашей цели в Timer управление может быть использовано в качестве триггера для того, чтобы частичные постбэк срабатывают каждые 5 секунд:

<asp:ScriptManager ID="scriptManagerMain" runat="server"/> 
<asp:Timer ID="timer" Interval="5000" runat="server"/> 
<asp:UpdatePanel runat="server"> 
    <ContentTemplate> 
     <asp:Panel ID="panelToBeUpdated" runat="server"> 
      <asp:Label ID="lblContent" runat="server" ></asp:Label> 
     </asp:Panel> 
    </ContentTemplate> 
    <Triggers> 
     <asp:AsyncPostBackTrigger ControlID="timer" /> 
    </Triggers> 
</asp:UpdatePanel> 

Answer 2

Я бы использовал Jquery для отправки запроса AJax на сервер для получения обновленного контента. Получив контент, я снова буду использовать JQuery для обновления разметки.

Вы можете установить до запуска каждые 5 мин с помощью setInterval в Javascript

Answer 3

Трудно дать конкретный пример без кода. Но вам в основном нужно загрузить новый контент с помощью запроса ajax, который запускается таймером.

setInterval(function(){ 
    $.ajax({ 
     url: "someUrlThatServesUpdatedContent.aspx", 
     cache: false 
    }).done(function(html) { 
     $("#results").html(html); 
    }); 
}, 300000); 

Вышеприведенный пример является простым примером, указывающим на то, что вы в правильном направлении.

Edit: Вот пример того, как сделать вызов Ajax без JQuery https://stackoverflow.com/a/2792721/1059001

Answer 4

Это можно сделать с помощью AJAX с использованием метода, описанного в предыдущих ответах, но если вы хотите иметь на стороне сервера решение, которое я рекомендовал бы загрузку той части страницы в IFRAME, с мета обновления:

<meta http-equiv="refresh" content="300"> 

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