Atualizar recados a cada 5 ou 10 minutos via AJAX

[Julian Toledo 0]

Olá pessoal do iMasters, estou desenvolvendo um site para uma Web Rádio.

 

Estou usando o Ajax através do jQuery via JSON.

No momento, já tenho 60% funções prontas e operante (enviar recados, contato, pedidos; ler histórico de recados; listar grade de programação; entre outras).

 

Mas, estou tendo um grande dificuldade para fazer o AJAX consultar a ATUALIZAÇÃO dos recados, onde a cada 5 ou 10 minutos ele faça um requisição para verificar se existe novos recados publicados.

 

Alguem sabe me dizer como fazer um "cronometro" no JS para executar uma requisição AJAX em um determinado tempo.

Onde, independente de se retornou conteúdo ou não, ele inicia o cronometro para solicitar a requisição novamente apos o tempo determinado.

[gremio10 14]

Tu pode fazer o seguinte:

 

Cria uma função que irá fazer a pesquisa, gerar o corpo para colocar na página, depois tu usa a

window.setInterval(‘funcao()’, intervalo_em_milisegundos);

 

Com ela, tu coloca o tempo que tu quer que a função seja executada. Então se 1000 milissegundos é igual a 1 segundo, 5 minutos é ?

[Julian Toledo 0]

Legal,

 

Apliquei esta função no cógigo e após o intervalo definido retornou seguinte erro: "atualizarRecados is not defined".

 

Por algum motivo, que desconheço, o JS não encotrou a função!

[gremio10 14]

Mostre como você fez.

[Julian Toledo 0]

Agora sim, funcionou!

 

Erra erro na sintaxe, para chamar a função ela não deve estar dentro de asplas e nem conter parenteses ficando assim:

 

setTimeout(atualizarRecados, 40000);

 

Como podem perceber, também alterei o método passando a usar o setTimeout, pois se encaixou melhor a situação.

Obs.: Os 40 segundos é para teste, depois vou colocar 600000 referente aos 10 minutos que desejo.

 

Bom, a atualização já está funcionando, só não consegui colocar uma Efeito para estilizar a entrada deste novo conteúdo no HTML.

 

Atualmente, depois que monto o var html com o conteudo que será postado no site, faço assim:

 

$('#lista_recados').prepend(html);

 

E o html é inserido no topo da listagem de forma SECA e DIRETA, alguém sabe como poderia fazer para colocar um efeito de animação para entrar mais SUAVE, algo parecido com o SHOW()?

[gremio10 14]

tem o .prependTo, .after, .appendTo, vê qual se encaixa melhor para o que você quer.

[Julian Toledo 0]

Conheço esses métodos, ambos para inserção de conteúdo no html.

Mas o .prepend está perfeito.

 

O preciso é unir o .prepend a algum efeito "animado" para quando o conteúdo for inserido no HTML ele entre de forma "deslisante" como o facebook faz, ou como os metodos slideDown, slideUp, slideToggle, entre outros fazem para abrir ou ocultar elementos HTML.

 

Fiz algumas tentativas, mas ambas não funcionaram!rs

 

$('#lista_recados').prepend(html).slideDown();

 

$('#lista_recados').prepend(html, function() {
slideDown();
});

[gremio10 14]

Tu tem de por na tua função slideDown() o prepend.

[Julian Toledo 0]

Coloquei no slideDown e também não funcionou!

 

Veja como ficou:

 

$('#lista_recados').slideDown(9000, function() {
$(this).prepend(html);
});

[gremio10 14]

O seu slideDown é uma função ou um plugin ?

[Julian Toledo 0]

Plugin do jQuery!