[Resolvido] Atualizar div sem apagar o conteúdo atual

[Ronaldo Bueno 23]

Pessoal, infelizmente não estou conseguindo sozinho resolver alguns problemas. posto aqui, mas poucos tem a paciência de ensinar. mas irei tentar com mais um rsrrss.

 

O que acontece é o seguinte:

 

tenho uma página de recados que abre em um popup. Quando abre a página, ele vao no banco e busca as mensagens que no campo mostrou é igual a N (de não). até ai tudo bem, abre e aparece os recados que ainda não foram visto enviados para aquela pessoa.

 

Ai coloquei uma rotina para ir verificar no banco se existe novas mensagens, ele vai lá e esta fazendo tudo direito, acontece que quando volta ele atualiza a div ou seja, pega o recado novo e apaga os recados que tinha na pagina.

 

Vi uma dica em um forum para fazer uma nova consulta e mostrar todas. acontece que quando abre a página cada vez que ele lê um recado ele coloca no banco como mostrou igual a S (de sim) e na consulta, que faço só deve aparecer os recados que ainda não foram mostrados.

 

Página principal tem essa div

	<div id="verrecados">
		<h1><a href="javascript:abreRecado('recado.asp','Recados');">Ver</a></h1>
		<a href="javascript:abreRecado('recado.asp','Recados');"><img src="imagens/verrecados.png" alt="Ver Recados" border="0" /></a>
		<h1><a href="javascript:abreRecado('recado.asp','Recados');">Recados</a></h1>
	</div>

página recados.asp

mostra os recados

	<%
	Set objConn =  Server.CreateObject("ADODB.Connection")
	objConn.Open "aqui coloco a string de conexão completa"
	strQueryveri = "select * from recados where mostrou='N' and para='"&usuario&"' order by data DESC,hora DESC"
	Set rs=Server.CreateObject("ADODB.Recordset")
	rs.Open strQueryveri, objConn
	%>
	<div id="basic1" class="myform1">
	<%
	if rs.Eof then
		Response.Write("<p align=""center""><b>Não existe novos recados</b></p>")
	Else 
		While Not rs.Eof %>
			<p>De: <b><%=rs("de")%></b> - Data: <b><%=rs("data")%></b> às <b><%=rs("hora")%></b>
			<br />
			<%=rs("msg")%>
			</p>
			<%
			codrecados = rs("codigo")
			atualiza = "update recados set mostrou='S' where codigo="&codrecados
			Set rsatualiza=Server.CreateObject("ADODB.Recordset")
			rsatualiza.Open atualiza, objConn
		rs.MoveNext
		Wend
	End If
	%>
	</div>

e mostra o form para a pessoa mandar outro recado

	<div id="basic" class="myform">
		<form name="form1" method="post" action="enviar-recado.asp?usuario=<%=usuario%>" onSubmit="return CheckFormRecados();" />

		<label>Para
		<span class="small"></span>
		</label>
		<input name="dado" id="dado" type="text" size="50">

		<label>Mensagem
		<span class="small">Caracteres Restantes: <span id="cont"><b>100</b></span></span>
		</label>
		<textarea cols="10" rows="4" name="msg" id="msg" onKeyUp="blocTexto(this.value)" /></textarea>
			
		<button  type="submit">OK</button>
		
	</div>
	<div id="usuario" class="myform1"><%=usuario%></div>

para ver mais recados

<script type="text/javascript">
function ajaxInit() {
        var req;
        try {
            req = new ActiveXObject("Microsoft.XMLHTTP");
        } catch(e) {
            try {
                req = new ActiveXObject("Msxml2.XMLHTTP");
            } catch(ex) {
                try {
                    req = new XMLHttpRequest();
                } catch(exc) {
                    alert("Esse browser não suporta Ajax");
                    req = null;
                }
            }
        }
        return req;
    }
    function AtualizaRecados(valor){
	   Procurausuario=document.getElementById("usuario").innerHTML
       ajax = ajaxInit(); 
        ajax.open("GET","pegar-novos-recados.asp?usuario="+Procurausuario,true);
        ajax.onreadystatechange=function() {
            if (ajax.readyState==4){
             
               if(ajax.status==200)
		{
				document.getElementById("basic1").innerHTML=ajax.responseText
		}
            }
        }
        ajax.send(null);
}

</script>

página asp para ver se tem mais recados

<%
	usuario = Request.QueryString("usuario")

	Set objConn =  Server.CreateObject("ADODB.Connection")
	objConn.Open "aqui coloco a string de conexão completa"
	strQueryveri = "select * from recados where mostrou='N' and para='"&usuario&"' order by data DESC,hora DESC"
	Set rs=Server.CreateObject("ADODB.Recordset")
	rs.Open strQueryveri, objConn

	if rs.Eof then
		Response.Write("<p align=""center""><b>Não existe novos recados</b></p>")
	Else 
		While Not rs.Eof 
			de = rs("de")
			data = rs("data")
			hora = rs("hora")
			msg = rs("msg")

			Response.Write("<p>De: <b> "&de&" </b>- Data: <b>"&data&" </b>às <b>"&hora&"</b><br />"&msg&"</p>")

			codrecados = rs("codigo")
			atualiza = "update recados set mostrou='S' where codigo="&codrecados
			Set rsatualiza=Server.CreateObject("ADODB.Recordset")
			rsatualiza.Open atualiza, objConn
		rs.MoveNext
		Wend
	End If
%>

Ou seja quando ele lê o recado marca S e claro que na consulta estou falando para ele mostrar os que são N, porque esse N eu coloco quando cadastro o recado.

esse dilema é porque não consegui achar nada que fosse no banco busca mais recados e mostrar a cima dos outros já existentes.

 

Alguém poderia dar uma força ?

[Eliseu M. 2]

Hmm, não bastaria dar um UPDATE logo que a requisição Ajax é feita e concatenar o resultado com o antigo? Eu penso que um jeito de resolver isso é o seguinte:

 

- Guardar os recados antigos da DIV numa variável;

- Concatenar a próxima requisição com este conteúdo.

 

var recados_antigos = document.getElementById("verrecados").innerHTML;
document.getElementById("verrecados").innerHTML = ajax.responseText + recados_antigos;

Espero que resolva. Até mais!

[Ronaldo Bueno 23]

entendi sua lógica, mas onde iria colocar ? antes de:

 

ajax.open("GET","pegar-novos-recados.asp?usuario="+Procurausuario,true);

Obrigado pela resposta

[Eliseu M. 2]

Não, pode ser aí:

 

if(ajax.status==200) {
	var recados_antigos = document.getElementById("basic1").innerHTML;
	document.getElementById("basic1").innerHTML = ajax.responseText + recados_antigos;
}

Pode dar alguma problema de quebra de linha, sei lá... daí é só arrumar aí na concatenação mesmo. De nada =]

[Ronaldo Bueno 23]

deu problema. agora ele não esta indo ver as novas ? rsrsrs

[Eliseu M. 2]

Como você está fazendo a requisição para verificá-los? Por botão, intervalo de tempo...? Ah, na sua função AtualizaRecados(valor) para que serve este parâmetro (valor)?

 

Eu penso que é melhor usar o setInterval:

 

window.onload = function() {
	setInterval(AtualizaRecados, 5000); // tempo em milissegundos
}

[Ronaldo Bueno 23]

Eliseu, desculpa, tinha uma linha lá que estava mantendo de teste e esqueci de tirar ...

 

Funcionou perfeitamente .... era exatamente isso.

 

Lembra daquele outro post sobre o marketwatch ? então acho que vou conseguir resolver dessa forma também. só vai faltar o efeito para entrar a noticia.

 

Mas esse ficou 10. muito obrigado pela atenção.

 

Abs,

[Eliseu M. 2]

Estamos aqui para isso =]

 

Bem, ainda bem que você entendeu o esquema, e sobre o MarketWatch, é exatamente o mesmo. O efeito de transição a ser usado pode ser fade, ou um highlightFade, com jQuery, pois representa melhor a chegada de informação. Além dele, um ótimo também é o slide, onde você pode fazer os dados da requisição "empurrarem" o conteúdo antigo para baixo.

 

Estou com sono :S Falou!

[Ronaldo Bueno 23]

Eliseu, encontrei mais um problema, mas vou tentar fazer sozinho e se tiver alguma dúvida post aq ok?

 

Em cima na página recados tem o form para a pessoa responder. e quando vai para o asp para enviar o recado ele volta dando reflesh. então claro os recados são apagados, vou tentar enviar o form também por ajax, assim faço a mesma coisa para retornar os antigos.

 

Esqueci. você acharia legal manter o histórico mesmo depois de enviar a "resposta" por exemplo???

 

Sobre o efeito de empurrar, esse era o ideal, sabe como faço para começar a procurar sobre ele ?

 

Muito obrigado por enquanto. boa noite ...

 

acho melhor não fazer o histórico dos recados depois que enviar o form, mesmo porque são div diferentes.

 

ou seja, teria q retornar o form em branco em uma div e os recados em outra. e eu ainda não aprendi a dar dois resultados nesse estilo rsrsrs.

 

mesmo assim irei aguardar sua opnião ok? abs,

 

Eliseu,

 

tentei fazer sozinho, envia o recado, mas na página de retorno tinha colocado um document.location = "recado.asp" para voltar e ai encontrei o seguinte problema, como irei fazer retornar o form em branco em uma div e o histórico dos recados em outra div ? me bati nisso, eu ainda não aprendi a retonar dois resultados daquela forma.

 

Abs,

 

ps: travou tudo aqui e enviou várias depois rsrsrsrs