Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

InSoNiA

ajax

Por , em Javascript

Recommended Posts

InSoNiA    0

InSoNiA
Postado

Olá pessoal estou reformulando o portal da minha cidade e agora estou fazendo um site sem refresh, para as páginas já testei e funciona legal, o problema é que para envio de variaveis para interagir com minhas páginas em PHP e conmsulta no banco não ta retornando.

 

 

Uso o seguinte esquema para carregar as páginas dentro de uma DIV:

 

página selectCustomer.js

// JavaScript Document
var xmlHttp

function showCustomer(str) {
xmlHttp=GetXmlHttpObject()
  if (xmlHttp==null) {
	alert ("Seu navegador são suporta HTTP Request")
	return
  }
var url=str
  if(url.indexOf("?")==-1) {
	url=url+"?"
  } else {
	  url=url+"&"
	}
url=url+"sid="+Math.random()
xmlHttp.onreadystatechange=stateChanged
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
}

function stateChanged() {
  if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") {
	var texto = xmlHttp.responseText;
	texto = texto.replace(/\+/g," ");
	texto = unescape(texto);
	document.getElementById("txtHint").innerHTML=texto;
	document.getElementById("aguarde").style.display = "none";
  }
  if(xmlHttp.readyState==1) {
	document.getElementById("aguarde").style.display = "block";
	document.getElementById("aguarde").innerHTML="<center><br><br><img src='imagens/carregando.gif' title=''>Carregando.</center>";
  }
  if(xmlHttp.readyState==2) {
	document.getElementById("aguarde").style.display = "block";
	document.getElementById("aguarde").innerHTML="<center><br><br><img src='imagens/carregando.gif' title=''>Carregando..</center>";
  }
  if(xmlHttp.readyState==3) {
	document.getElementById("aguarde").style.display = "block";
	document.getElementById("aguarde").innerHTML="<center><br><br><img src='imagens/carregando.gif' title=''>Carregando...</center>";
  }
}

function GetXmlHttpObject() {
var objXMLHttp=null
  if (window.XMLHttpRequest) {
	objXMLHttp=new XMLHttpRequest()
  } else if (window.ActiveXObject) {
	  objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP")
	}
  return objXMLHttp
}

Agora na página principal do site:

 

<script src="js/selectCustomer.js"></script>
<script language="javascript">
<!--
//Ajax
  function chama(str) {
   showCustomer(str);
	}
-->
</script>
<body onload="chama('capa.html')">
<tr>
	<td>
	<div id="txtHint"></div>
		<div id="aguarde" style="left:500px; position:absolute; top:400px; background-color: #FFFFFF; z-index=10; filter: Alpha(Opacity=30);"></div></td>
</body>

A busca retorna vazia, estou chamando o form assim:

 

<form id="form" name="form" method="post" action="java script: chama('busca.php');">

<input name="palavra" type="text" id="palavra" size="34" />

<input name="Submit" type="submit" class="botao_padrao" value="Buscar" />

</form>

 

o endereço para quem quiser conferir é www.riopretoguia.com.br/index3.php

 

ele funcionando é www.riopretoguia.com.br

 

t+

Compartilhar este post

Link para o post
Compartilhar em outros sites

DSerma    19

DSerma
Postado

Só uma observação:

 

// JavaScript Document
var xmlHttp

function showCustomer(str) {
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null) {
alert ("Seu navegador são suporta HTTP Request")
return
}
var url=str
if(url.indexOf("?")==-1) {
url=url+"?"
} else {
url=url+"&"
}
url=url+"sid="+Math.random()
xmlHttp.onreadystatechange=stateChanged
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
}

ALi onde está a "url", você deve adicionar os parametros na url, do tipo "?Cod=1".

 

Vamos supor qur você irá realizar uma consulta por Id, e você tem um campo no form com o id = "numero", então a sintaxe seria essa:

 

// JavaScript Document
var xmlHttp

function showCustomer(str) {
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null) {
alert ("Seu navegador são suporta HTTP Request")
return
}
var url=str
if(url.indexOf("?")==-1) {
url=url+"?"
} else {
url=url+"&"
}
url=url+"sid="+Math.random()
url = url + "&?Id=" + document.getElementById("numero").value;
xmlHttp.onreadystatechange=stateChanged
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
}

 

Neste caso.. a variavel "Id" da url teria o valor que foi digitado no campo "numero" em nosso form.. podendo assim, a página que contem o Server-Sie ( ASP, PHP, etc ) realizar a consulta ao bd.. pegando essa informação via "Request.QueryString("Id")"...

 

 

Espero ter ajudado....

 

 

Abraços...

Compartilhar este post

Link para o post
Compartilhar em outros sites

InSoNiA    0

InSoNiA
Postado

Olá Darkdemo, cara entendi melhor com sua explicação, porem o que não consegui entender ainda por nunca ter feito, é o lance agora da página busca.php no caso, como pego a variavel.

 

Pois mudei o código acrescentando a linha que voce colocou, e mesmo assim não funciona, fica vazio, assim deduzi que deve ser o fato de que agora a página busca.php tem que pegar aquele valor.

 

Antes pegava o valor assim

$palavra = $_POST['palavra'];

 

Acho que agora deveria pegar de outra forma né? Outra dúvida conforme o código que estou usando a palavra vai ser mostrada na URL?

 

Segue abaixo o código modificado, se estou enchergando bem, você adicionou somente 1 linha correto?

url = url + "&?Id=" + document.getElementById("numero").value;

ficou assim:

url = url + "&?palavra=" + document.getElementById("palavra").value;

 

 

Agradeço sua atenção, pois francamente tava pensando em desistir e fazer dando REFRESH mesmo, mas para mim é de grande importância fazer sem refresh, pois quero aprender AJAX a qualuqer custo. E esse site quando comecei a desenvolve-lo a 5 anos atrás nem sabia nada de programação e foi meu melhor laboratório rssss...

 

T+

 

 

---------------------------------

Tópico Mesclado

---------------------------------

 

Beleza consegui! Agora deu certo esta trazendo os dados. Porém surgiu outro probleminha.

 

Tenho que clicar DUAS (2) vezes no botão para ele trazer os dados.

 

Não entendi porque, já vi e revi o código e não consigo entender o porque! Alguem pode ajudar?

Compartilhar este post

Link para o post
Compartilhar em outros sites

DSerma    19

DSerma
Postado

Opa.. mal a demora.....

 

Então.... assim ta certinho:

 

url = url + "&?palavra=" + document.getElementById("palavra").value;

 

A palavra digitada no seu input será adicionada a url da página....

 

Agora você deve usar a função que pegue os valores de QueryString no PHP ( sou especialista em ASP, não manjo p**** nenhuma de PHP... heheh )..

 

Em ASP seria assim:

 

Palavra = Request.QueryString("Palavra")

Em PHP

 

Não faço idéia .. hehehe

Eu tb aprendi AJAX sozinho..... ASP tb.. HTML tb.. Java tb.. e quase tudo que eu sei aprendi sozinho.... então.. qlqr dúvida.. posta ai..

 

Abraços...

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito