Gerar atualização de post na base e atualizar página sem refresh - F5

[cristianomg 0]

Bom dia pessoal,

Venho aqui pedir uma orientação onde posso encontrar o que preciso.

Seguinte tenho um sistema de intranet que estou criando, com o modelo de publicação de fotos e texto de fotos do face.

Ok, o sistema faz upload salva o texto tudo por method="Post" .Mas eu queria que a requisição não tivesse que chamar outra pagina e após a inserção na base retornar a página atual atualizada com a minha ultima publicação, então dois pontos:

1 - Eu preciso que ao publicar seja salvo sem refresh ou envio de Post e retorno do mesmo, andei olhando e estou implementando meia boca com javascript enviar e gravar na base...

AGORA UMA ORIENTAÇÃO DO QUE PRECISO SERIA, ABAIXO:

2 - Agora ai é que são elas: se eu conseguir salvar com Javascrpit como faço para que tipo "a minha linha do tempo" , recarregue na página a minha postagem sem ter a necessidade de dar F5 ??

Neste item dois se alguém souber algum macete ou tutorial sobre isso agradeço.

Valeu!

[ESerra 744]

Simples, ajax.

Você vai enviar os dados com ajax e receber o retorno, nesse retorno você já pode ter o item que será adicionado a sua linha do tempo ou então baseado no retorno (erro/sucesso) você faz outra requisição e atualiza a linha do tempo com o retorno a segunda requisição... mas a base de tudo é implementar o ajax.

[gabrieldarezzo 255]

Pode ajudar :

https://github.com/gabrieldarezzo/desafiosInternos/tree/master/ajax

[EdCesar 124]

Complementando o que o ESerra disse:

function atualizaLinhaDoTempo()
{
  alert('linha do tempo atualizada'); // implementação ajax para atualizar a linha do tempo
  atualizaLinhaDoTempoACadaCincoSegundos();
}


function atualizaLinhaDoTempoACadaCincoSegundos() {
    setTimeout(atualizaLinhaDoTempo, 5000);
}


atualizaLinhaDoTempoACadaCincoSegundos();

[Visitante]

$.ajax({
    '...'//aqui é o get/post, data etc...
    success: function(e){
        //o 'e' é tudo que vem da sua página pra onde foi o post, neste caso o retorno.
        $('#linhaDoTempo').html(e);
    }
}):

Documentação do Ajax:

http://api.jquery.com/jquery.ajax/