Ir para conteúdo
Fórum Script Brasil
  • 0

Requisições Javascript


Edmilson Cruz

Pergunta

Olá pessoal,

A partir de um link faço uma requisição ao servidor para carregar um conteúdo em uma DIV específica no meu website. Até aí sem problema. Porém, gostaria de atualizar também o conteúdo de outra DIV simultâneamente ao clicar no mesmo link. Tem como fazer isso? Como agregar essas novas informações ao link que já contém a primeira função?

Obrigado pela atenção de todos que puderem ajudar.

Link para o comentário
Compartilhar em outros sites

12 respostass a esta questão

Posts Recomendados

  • 0

Estou usando os seguintes Scripts para o IE e Firefox/Opera:

<script type="text/javascript">
function retObjReq() 
{
return new ActiveXObject("Microsoft.XMLHTTP");
}
</script>[/color]

[color=#8B0000]&lt;script type="text/javascript">
function retObjReq() 
{
return new XMLHttpRequest();
}
</script>
A função que executa a requisição é essa:
<script type="text/javascript">
function loadCont( pag, id)
{
var objReq = retObjReq();
if (objReq)
{
objReq.onreadystatechange = function()
{
if (objReq.readyState == 4 && objReq.status == 200)
{	
showCont(objReq.responseText, id);
}
else if(objReq.readyState == 4 )
{
}
}
objReq.open("GET", pag, true);
objReq.send(null);
}
} 
function showCont(txt, id)
{
oDiv = document.getElementById(id);
oDiv.innerHTML = txt;
}
</script>
No link foi adicionado:
<a href="java script:;" onclick="loadCont();">Produtos</a>

Entre os parênteses foi colocado o arquivo HTML a ser inserido e a DIV de destino.

Agora gostaria que ao clicar nesse mesmo link fosse atualizada não somente essa, mas também uma outra DIV ao mesmo tempo. Aí está o ponto.

Valeu!

Link para o comentário
Compartilhar em outros sites

  • 0

opa, não tem misterio.

se você quizer manter o codigo dinamico, é só passar o nome da outra div como referencia.

assim como já faz com a primeira div.

ou se quizer facilitar ao maximo, porem amarrar o codigo, é só colocar uma linha a mais no codigo.

primeira opcao ficaria assim:

<a href="java script:;" onclick="loadCont();">Produtos</a>
ficaria:

<a href="java script:;" onclick="loadCont('pagina','div1','div2');">Produtos</a>
e...
<script type="text/javascript"> function loadCont( pag, id) {
<script type="text/javascript">
function loadCont( pag, id, id2)
{
showCont(objReq.responseText, id);
showCont(objReq.responseText, id, id2);
por ultimo:
function showCont(txt, id) { oDiv = document.getElementById(id); oDiv.innerHTML = txt; }
function showCont(txt, id, id2)
{
oDiv = document.getElementById(id);
oDiv.innerHTML = txt;
nDiv = document.getElementById(id2);
nDiv.innerHTML = txt;
}
isso se você quizer seguir o padrão do codigo, manter ele dinamico e tals. mas você pode esquecer isso tudo ai em cima e colocar só uma linha. aqui:
function showCont(txt, id) { oDiv = document.getElementById(id); oDiv.innerHTML = txt; }
você incluiria a linha:
function showCont(txt, id)
{
oDiv = document.getElementById(id);
oDiv.innerHTML = txt;
document.getElementById("nome_da_sua_div").innerHTML = txt;
}

e era isso,

sucesso ai.

Link para o comentário
Compartilhar em outros sites

  • 0

Muito obrigado! Muito obrigado mesmo! :D

Sucesso para você também!

Ah, sim, mas isso funciona se, por exemplo, quando clicar no link, a Página1.html é carregada na Div1 e a Página2.html na Div2? Ou somente a mesma página é carregada em ambas as Div"s?

:huh:

É meu amigo, não deu certo. Ao clicar no link tanto a div1 quanto a div2 recebem a mesma página, com o mesmo conteúdo. Na verdade gostaria que ocorresse da seguinte maneira:

- Clique no "Link" e...

1. A DIV1 recebe o conteúdo da PÁGINA1;

2. A DIV2 recebe o conteúdo da PÁGINA2.

Exemplificando:

- A DIV1 já está recebendo um conteúdo com textos explicativos, que é a PÁGINA1.

- A DIV2 receberia a PÁGINA2 com um filme SWF ilustrando o texto da DIV1.

Essa é a questão. :blink:

Link para o comentário
Compartilhar em outros sites

  • 0

certo,

é só fazer o mesmo esquema que foi feito pra adicionar a div.

foi passado o nome da div por parametro, então adicionamos a nova pagina por parametro também.

<a href="java script:;" onclick="loadCont('pagina1', 'pagina2','div1','div2');">Produtos</a>
<script type="text/javascript">
function loadCont( pag, pag2, id, id2)
{
showCont(objReq.responseText, pag2, id, id2);
function showCont(txt, txt2, id, id2)
{
oDiv = document.getElementById(id);
oDiv.innerHTML = txt;
nDiv = document.getElementById(id2);
nDiv.innerHTML = txt2;
}

tranquilo, era isso!?

t+

Link para o comentário
Compartilhar em outros sites

  • 0

ahhhh

tu ta passando só o endereco da pagina???

eu axei que tu tava passando a pagina pronta já.

então tem que pegar o conteudo da url antes pelo ajax antes de chamar a funcao.

nessa funcao aqui, você precisa chamar a pagina passando a url:

function loadCont( pag, pag2, id, id2 )
{
var objReq = retObjReq();
var objReq2 = retObjReq();
if (objReq)
{
objReq.onreadystatechange = function()
{
if (objReq.readyState == 4 && objReq.status == 200)
{
showCont(objReq.responseText, objReq2.responseText, id, id2);
}
else if(objReq.readyState == 4 )
{
}
}
objReq.open("GET", pag, true);
objReq2.open("GET", pag2, true);
objReq.send(null);
objReq2.send(null);
}
}

eu não testei... se não funcionar, vai ter que deixar a funcao como estava antes e chamar ela por duas vezes.. só que ai vai ter um intervalo de atualizacao entre as duas divs.

t+

Link para o comentário
Compartilhar em outros sites

  • 0

Testei dessa última maneira, porém agora não carregou nada, acusando erro de página. Retornei com o script inicial e funcionou como antes o carregamento da primeira página. Numa tentativa sem expectativa de sucesso modifiquei o link como o seguinte:

<a href="java script:;" onclick="loadCont('http://localhost/site/pagina1.html', 'div1'); loadCont('http://localhost/site/pagina2.html', 'div2');">Link</a>

Atualizei a página, cliquei e funcionou perfeitamente, sem erro nenhum! As duas div's foram atualizadas com os novos conteúdos.

Acho que essa é a solução... :lol:

O que acha?

Link para o comentário
Compartilhar em outros sites

  • 0

dae Edmilson,

se funcionou deste jeito esta otimo! :)

foi justamente o que sugeri caso não funcionasse.

eu não testei... se não funcionar, vai ter que deixar a funcao como estava antes e chamar ela por duas vezes.. só que ai vai ter um intervalo de atualizacao entre as duas divs.

é isso ai, sucesso sempre!

t+

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152k
    • Posts
      651,7k
×
×
  • Criar Novo...