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

(Resolvido) duvida ajax

ricardinho

Perguntado por ricardinho,

 Share

Pergunta

ricardinho

ricardinho

Postado
Postado

ola pessoal estou com o seguinte problema, curso ciencia da computacao meu prof. pediu para fazer uma lista de compras em ajax e carregar os dados atraves do servidor (uso o vertrigo ). so novo nesta linguagem !!! e o prof. não da muitas dicas, tenho que entregar ate terca.

eu criei um arquivo chamado produtos.xml e joguei no servidor segue abaixo

<LANCHONETE>
 <PRODUTOS>
  <TIPO>LANCHE</TIPO> 
  <NOME>X-SALADA</NOME> 
  <preço>4.5</preço>
  </PRODUTOS>
  

 <PRODUTOS>
  <TIPO>LANCHE</TIPO> 
  <NOME>MISTO QUENTE</NOME> 
  <preço>5.00</preço>
  </PRODUTOS>
  
  <PRODUTOS>
  <TIPO>LANCHE</TIPO> 
  <NOME>X-BURGUER</NOME> 
  <preço>6.00</preço>
  </PRODUTOS>


<PRODUTOS>
  <TIPO>LANCHE</TIPO> 
  <NOME>PAO COM OVO</NOME> 
  <preço>2.5</preço>
  </PRODUTOS>
  
  <PRODUTOS>
  <TIPO>BEBIDAS</TIPO> 
  <NOME>GUARANA</NOME> 
  <preço>2.00</preço>
  </PRODUTOS>
    
  <PRODUTOS>
  <TIPO>BEBIDAS</TIPO> 
  <NOME>GUARANA</NOME> 
  <preço>2.00</preço>
  </PRODUTOS>
    
  <PRODUTOS>
  <TIPO>BEBIDAS</TIPO> 
  <NOME>COCA COLA</NOME> 
  <preço>2.50</preço>
  </PRODUTOS>
    
  <PRODUTOS>
  <TIPO>BEBIDAS</TIPO> 
  <NOME>GATOREDE</NOME> 
  <preço>5.00</preço>
  </PRODUTOS>
    
  <PRODUTOS>
  <TIPO>BEBIDAS</TIPO> 
  <NOME>FANTA UVA</NOME> 
  <preço>2.00</preço>
  </PRODUTOS>
  
    
  <PRODUTOS>
  <TIPO>SOBREMESAS</TIPO> 
  <NOME>TORTA DE MORANGO</NOME> 
  <preço>3.50</preço>
    </PRODUTOS>
    
      <PRODUTOS>
  <TIPO>SOBREMESAS</TIPO> 
  <NOME>PUDIM DE LEITE</NOME> 
  <preço>4.00</preço>
    </PRODUTOS>
      <PRODUTOS>
  <TIPO>SOBREMESAS</TIPO> 
  <NOME>SORVETES</NOME> 
  <preço>2.85</preço>
    </PRODUTOS>
      <PRODUTOS>
  <TIPO>SOBREMESAS</TIPO> 
  <NOME>MUSSI</NOME> 
  <preço>4.50</preço>
    </PRODUTOS>
  </LANCHONETE>
criei este codigo para chamar o arquivo 
<html>
<body>
<p> </p>
<p>
 &lt;script type="text/javascript">
var xmlDoc=null;
if (window.ActiveXObject)
{// code for IE
xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
}
else if (document.implementation.createDocument)
{// code for Firefox, Mozilla, Opera, etc.
xmlDoc=document.implementation.createDocument("","",null);
}
else
{
alert('Your browser cannot handle this script');
}
if (xmlDoc!=null)
{
xmlDoc.async=false;

xmlDoc.load("http://localhost/ricardo/produtos.xml");
document.write("<table border='1'>");
document.write("<td>");
document.write("Tipo");
document.write("</td>");
document.write("<td>");
document.write("Nome");
document.write("</td>");
document.write("<td>");
document.write("Preço");
document.write("</td>");
var x=xmlDoc.getElementsByTagName("PRODUTOS");
for (var i=0;i<x.length;i++)

{ 

document.write("<tr>");
document.write("<td>");
document.write(x[i].getElementsByTagName("TIPO")[0].childNodes[0].nodeValue);
document.write("</td>");
document.write("<td>");
document.write("<input type =checkbox>    ");
document.write(x[i].getElementsByTagName("NOME")[0].childNodes[0].nodeValue);
document.write("</td>");
document.write("<td>");
document.write(x[i].getElementsByTagName("preço")[0].childNodes[0].nodeValue);
document.write("</td>");
document.write("</tr>");
}
document.write("</table>");

}
  </script>
</p>
<form name="form2" method="post" action="">
  <input type="button" name="Lista Pedidos" value="listar pedidos">
</form>
<form name="form1" method="post" action="">
 <textarea name="textarea" cols="60" rows="10"></textarea>
</form>
<p>  </p>
</body>
</html>

beleza com este codigo eu consegui puxar os itens em uma tabela ...

o objetivo é clicar em cada produto e quando apertar o botao aparecer o nome do produto o preço e o total como faco isso ?

me ajudem tive varias ideias para fazer isso so que ainda não consegui...

obrigado

ola pessoal acho que não estao entendendo nada ...

gostaria que alguém colocasse este codigo no dreamweaver, pois vai ficar mais facil de vocês entenderem o que eu quero fazer so vendo o codigo fica muito complicado...

me ajudemmmmmmmm!!!!!!!!!!!!!!!!

grato

Link para o comentário
Compartilhar em outros sites

7 respostass a esta questão

Posts Recomendados

  • 0
KaKarotto

KaKarotto

Postado
Postado

Eu ajudo, mas não entendi nada...

Tem como fazer um desenho em algum lugar de como deve ficar a tabela, ou a tela?

Não faz sentido pra mim aquele textarea nem faz sentido o funcionamento do programa como falou....

Link para o comentário
Compartilhar em outros sites
  • 0
Jonathan Queiroz

Jonathan Queiroz

Postado
Postado

Você poderia atribuir um id para cada elemento do preço e depois fazer um loop pra pegar todos os valores

Exemplo:

for (var i=0;i<x.length;i++) { 
document.write("<tr>");
document.write("<td>");
document.write(x[i].getElementsByTagName("TIPO")[0].childNodes[0].nodeValue);
document.write("</td>");
document.write("<td>");
document.write("<input type =checkbox>    ");
document.write(x[i].getElementsByTagName("NOME")[0].childNodes[0].nodeValue);
document.write("</td>");
document.write("<td id='preco_" + i + "'>");
document.write(x[i].getElementsByTagName("preço")[0].childNodes[0].nodeValue);
document.write("</td>");
document.write("</tr>");
}
numero_elementos = i
Loop para pegar os valores e somá-los: 
valor = 0
for (z=0;z<=numero_elementos;z++) {
x = document.getElementById("preco_"+z)
if (x==null) {break;}else{
valor += x.innerHTML
}
}
valor = eval(valor)
alert("O preço total é de "+valor)

Espero ter ajudado...

Qualquer coisa, posta aí !

Link para o comentário
Compartilhar em outros sites
  • 0
ricardinho

ricardinho

Postado
  • Autor
Postado

OLA JONATHAN OBRIGADO PELA AJUDA ... O FOR ESTA DANDO CERTO MAIS QUANDO JOGO O LOOP P/ A SOMA ELE SOME O MINHA TABELA TENTEI FAZER UMA FUNCAO COM O LOOP SOMA MAIS CONTINUA SUMINDO A TABELA...

VOU TENTAR MUDAR MAIS ALGUMA COISA AQUI.....

GRATO

Você poderia atribuir um id para cada elemento do preço e depois fazer um loop pra pegar todos os valores

Exemplo:

for (var i=0;i<x.length;i++) { 
document.write("<tr>");
document.write("<td>");
document.write(x[i].getElementsByTagName("TIPO")[0].childNodes[0].nodeValue);
document.write("</td>");
document.write("<td>");
document.write("<input type =checkbox>    ");
document.write(x[i].getElementsByTagName("NOME")[0].childNodes[0].nodeValue);
document.write("</td>");
document.write("<td id='preco_" + i + "'>");
document.write(x[i].getElementsByTagName("preço")[0].childNodes[0].nodeValue);
document.write("</td>");
document.write("</tr>");
}
numero_elementos = i
Loop para pegar os valores e somá-los: 
valor = 0
for (z=0;z<=numero_elementos;z++) {
x = document.getElementById("preco_"+z)
if (x==null) {break;}else{
valor += x.innerHTML
}
}
valor = eval(valor)
alert("O preço total é de "+valor)

Espero ter ajudado...

Qualquer coisa, posta aí !

Link para o comentário
Compartilhar em outros sites
  • 0
Jonathan Queiroz

Jonathan Queiroz

Postado
Postado

Cara, dá uma olhada em parte de seu código aqui:

xmlDoc.load("http://localhost/ricardo/produtos.xml");
document.write("<table border='1'>");
document.write("<td>");
document.write("Tipo");
document.write("</td>");
document.write("<td>");
document.write("Nome");
document.write("</td>");
document.write("<td>");
document.write("Preço");
document.write("</td>");
Você já começou colocando as colunas (td), sem antes colocar as linhas (tr) Além disso, seu código só irá funcionar ao rodar em seu computador (está apontando pra localhost...) Tenta algo como: 
xmlDoc.load("http://localhost/ricardo/produtos.xml");
document.write("<table border='1'>");
document.write("<tr>");
document.write("<td>");
document.write("Tipo");
document.write("</td>");
document.write("<td>");
document.write("Nome");
document.write("</td>");
document.write("<td>");
document.write("Preço");
document.write("</td>");
document.write("</tr>");
E depois o resto do código... Se lembre também de escrever o "</table>" no fim do loop 
for (var i=0;i<x.length;i++) { 
document.write("<tr>");
document.write("<td>");
document.write(x[i].getElementsByTagName("TIPO")[0].childNodes[0].nodeValue);
document.write("</td>");
document.write("<td>");
document.write("<input type =checkbox>    ");
document.write(x[i].getElementsByTagName("NOME")[0].childNodes[0].nodeValue);
document.write("</td>");
document.write("<td id='preco_" + i + "'>");
document.write(x[i].getElementsByTagName("preço")[0].childNodes[0].nodeValue);
document.write("</td>");
document.write("</tr>");
}
numero_elementos = i
document.write("</table>")

Obs.:

Quando for colocar online mude o link de localhost para o nome de seu servidor !

Qualquer cosia, posta aí !

Link para o comentário
Compartilhar em outros sites
  • 0
ricardinho

ricardinho

Postado
  • Autor
Postado

fala jonathan cara desculapa a minha ignorancia, mais não manjo muito de ajax, mais uma vez obrigado por estar me dando uma força...

cara tenho q entregar esse codigo hj na facu.....

se puder me add no MSN akyshow@hotmail.com

de uma olhada como ficou meu codigo verifica se estou no caminho certo fiz uma funcao AtualizaPedido e chamei ela junto com onClick

codigo inteiro

<html>
<body>

</script>
<script type="text/javascript">
var xmlDoc=null;
if (window.ActiveXObject)
{// code for IE
xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
}
else if (document.implementation.createDocument)
{// code for Firefox, Mozilla, Opera, etc.
xmlDoc=document.implementation.createDocument("","",null);
}
else
{
alert('Your browser cannot handle this script');
}
if (xmlDoc!=null)
{
xmlDoc.async=false;

xmlDoc.load("http://localhost/ricardo/produtos.xml");
document.write("<table border='1'>");
document.write("<tr>");
document.write("<td>");
document.write("Tipo");
document.write("</td>");
document.write("<td>");
document.write("Nome");
document.write("</td>");
document.write("<td>");
document.write("Preço");
document.write("</td>");
document.write("</tr>");
var x=xmlDoc.getElementsByTagName("PRODUTOS");
for (var i=0;i<x.length;i++)

{ 

document.write("<tr>");
document.write("<td>");
document.write(x[i].getElementsByTagName("TIPO")[0].childNodes[0].nodeValue);
document.write("</td>");

document.write("<td>");
document.write("<input type =checkbox>    ");
document.write(x[i].getElementsByTagName("NOME")[0].childNodes[0].nodeValue);
document.write("</td>");

//document.write("<td>");
document.write("<td id='preço" + i + "'>");
document.write(x[i].getElementsByTagName("preço")[0].childNodes[0].nodeValue);
document.write("</td>");
document.write("</tr>");
}
document.write("</table>");

}
function AtualizaPedido(){
valor = 0
for (z=0;z<=numero_elementos;z++) {
x = document.getElementById("PRECO_"+z)
if (x==null) {
    break;
    }
        else{
valor += x.innerHTML
        }
}
valor = eval(valor);
alert("O preço total é de "+valor);
}
  </script>
</p>
<form name="form2" method="post" action="">
 <input type="button" name="Lista Pedidos" value="listar pedidos" onClick="AtualizaPedido()"  />
</form>
<form name="form1" method="post" action="">
<textarea name="textarea" cols="60" rows="10"></textarea>
</form>
<p>  </p>
</body>
</html>

com este codigo esta aparecendo a tabela normal mais quando eu dou um click no botao não aparece nada

o correto era mostrar o preço o q pode estar errado? minha funcao?

grato

Link para o comentário
Compartilhar em outros sites
  • 0
Jonathan Queiroz

Jonathan Queiroz

Postado
Postado

Ei cara, posta os seus códigos dentro da tag "code" (fica mais organizado)

Já te add no MSN, é só aceitar !

Mas, respondendo à pergunta:

Parece que tem um erro no seu código, você esqueceu de definir a variável "numero_elementos"

O código ficaria mais ou menos assim:

<html>
<body>

</script>
<script type="text/javascript">
var xmlDoc=null;
if (window.ActiveXObject)
{// code for IE
xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
}
else if (document.implementation.createDocument)
{// code for Firefox, Mozilla, Opera, etc.
xmlDoc=document.implementation.createDocument("","",null);
}
else
{
alert('Your browser cannot handle this script');
}
if (xmlDoc!=null)
{
xmlDoc.async=false;

xmlDoc.load("http://localhost/ricardo/produtos.xml");
document.write("<table border='1'>");
document.write("<tr>");
document.write("<td>");
document.write("Tipo");
document.write("</td>");
document.write("<td>");
document.write("Nome");
document.write("</td>");
document.write("<td>");
document.write("Preço");
document.write("</td>");
document.write("</tr>");
var x=xmlDoc.getElementsByTagName("PRODUTOS");
for (var i=0;i<x.length;i++) { 

document.write("<tr>");
document.write("<td>");
document.write(x[i].getElementsByTagName("TIPO")[0].childNodes[0].nodeValue);
document.write("</td>");

document.write("<td>");
document.write("<input type =checkbox> ");
document.write(x[i].getElementsByTagName("NOME")[0].childNodes[0].nodeValue);
document.write("</td>");

//document.write("<td>");
document.write("<td id='preço" + i + "'>");
document.write(x[i].getElementsByTagName("preço")[0].childNodes[0].nodeValue);
document.write("</td>");
document.write("</tr>");
}
numero_elementos = i
document.write("</table>");

}
function AtualizaPedido(){
valor = 0
for (z=0;z<=numero_elementos;z++) {
x = document.getElementById("PRECO_"+z)
if (x==null) {
break;
}
else{
valor += x.innerHTML
}
}
valor = eval(valor);
alert("O preço total é de "+valor);
}
</script>
</p>
<form name="form2" method="post" action="">
<input type="button" name="Lista Pedidos" value="listar pedidos" onClick="AtualizaPedido()" />
</form>
<form name="form1" method="post" action="">
<textarea name="textarea" cols="60" rows="10"></textarea>
</form>
<p> </p>
</body>
</html>

Qualquer coisa, posta aí !

Obs.:

O código que eu fiz mostra o preço total (todos os elementos juntos)... Se quiser apenas de um elemento, especifique pelo id e mande procurar apenas ele, sem nenhum loop

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.

×
 Share
Ir para lista de Perguntas


  • Estatísticas dos Fóruns

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