Jump to content

POWERED BY:

Archived

This topic is now archived and is closed to further replies.

flavialieggio

auto completar

Recommended Posts

Deu um trabalho bom (fiquei até agora trabalhando nele sem parar) mas enfim, saiu:

 

<script src="engine/micoxAjax.js" type="text/javascript" language="javascript"></script><script language="javascript">function pega(quem){return document.getElementById(quem);}function pesquisa(e,valor){	/* crossbrowser elcio */	if(typeof(e)=='undefined')var e=window.event	source=e.target?e.target:e.srcElement	if(source.nodeType == 3)source = source.parentNode	/* fim crossbrowser */	/* capturando se o cara digitar seta pra baixo */	if(e.keyCode==40){ //seta pra baixo		pega("pagina").selectedIndex = 0;		pega("pagina").focus();		return true;	}	/* fim capturando */		//FUNÇÃO QUE MONTA A URL E CHAMA A FUNÇÃO AJAX	url="reste.php?valor="+valor;	ajaxGet(url,pega("pagina"),true)	}function altera(e,quem){	/* crossbrowser elcio */	if(typeof(e)=='undefined')var e=window.event	source=e.target?e.target:e.srcElement	if(source.nodeType == 3)source = source.parentNode	/* fim crossbrowser */	/* capturando se o cara digitar seta pra baixo */	if(e.keyCode==13 || e.keyCode==32){ //enter ou espaço		alteraReal(quem);	}	/* fim capturando */}function alteraReal(quem){	pega("nome").value = quem.value;	pega("nome").focus();	quem.style.visibility="hidden";}</script><style>* { padding:0; margin:0;}#tudo {  width:650px;  background-color:#f7f7f7;  font-size:10px;    font-weight: bold;  font-family: Verdana, Arial, Helvetica, sans-serif;}h2 {  font-size:10px;    color:#FF0000;  text-align:center;  background-color:#CCCCCC;}label {  cursor:pointer;}#nome {  width:150px;}#pagina {  position:absolute; /* isso aqui tem que ficar */  border:1px solid green;  height:120px;  visibility:hidden;}</style><body><div id="tudo"><h2><- BUSCA DINÂMICA -></h2><label for="nome">DIGITE AQUI O NOME DA PESSOA:</label><input type="text" id="nome" name="nome" onkeyup="pesquisa(event,this.value)" /><select name="pagina" id="pagina" onkeyup="altera(event,this)" onblur="alteraReal(this)" size="4"></select></div> <!-- fim da div tudo -->

A única coisa que irá mudar no arquivo micoxAjax.js é nesta linha:

pega("pagina").style.visibility="visible;"

deverá tirar o ponto-vírgula:

pega("pagina").style.visibility="visible"

 

Com sua licença poderia publicar a solução no meu blog também... ?? (editado)

Testae... Testei no FF e IE6 com sucesso.

Share this post


Link to post
Share on other sites

ola micox, copiei o codigo, modifiquei a linha... te ai beleza, mas nao ta aparecendo nada aqui... vou postar meu codigo!!

 

html:

<html> <head> <title>BUSCA DINÂMICA</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <script src="script1.js"></script> <script language="javascript">function pesquisa(e,valor){	/* crossbrowser elcio */	if(typeof(e)=='undefined')var e=window.event	source=e.target?e.target:e.srcElement	if(source.nodeType == 3)source = source.parentNode	/* fim crossbrowser */	/* capturando se o cara digitar seta pra baixo */	if(e.keyCode==40){ //seta pra baixo		pega("pagina").selectedIndex = 0;		pega("pagina").focus();		return true;	}	/* fim capturando */		//FUNÇÃO QUE MONTA A URL E CHAMA A FUNÇÃO AJAX	url="busca_nome.php?valor="+valor;	ajaxGet(url,pega("pagina"),true)	}function altera(e,quem){	/* crossbrowser elcio */	if(typeof(e)=='undefined')var e=window.event	source=e.target?e.target:e.srcElement	if(source.nodeType == 3)source = source.parentNode	/* fim crossbrowser */	/* capturando se o cara digitar seta pra baixo */	if(e.keyCode==13 || e.keyCode==32){ //enter ou espaço		alteraReal(quem);	}	/* fim capturando */}function alteraReal(quem){	pega("nome").value = quem.value;	pega("nome").focus();	quem.style.visibility="hidden";}</script><style>* { padding:0; margin:0;}#tudo {  width:650px;  background-color:#f7f7f7;  font-size:10px;    font-weight: bold;  font-family: Verdana, Arial, Helvetica, sans-serif;}h2 {  font-size:10px;    color:#FF0000;  text-align:center;  background-color:#CCCCCC;}label {  cursor:pointer;}#nome {  width:150px;}#pagina {  position:absolute; /* isso aqui tem que ficar */  border:1px solid green;  height:120px;  visibility:hidden;}</style><body><div id="tudo"><h2><- BUSCA DINÂMICA -></h2><label for="nome">DIGITE AQUI O NOME DA PESSOA:</label><input type="text" id="nome" name="nome" onkeyup="pesquisa(event,this.value)" /><select name="pagina" id="pagina" onkeyup="altera(event,this)" onblur="alteraReal(this)" size="4"></select></div> <!-- fim da div tudo --></body> </html>

JS

// JavaScript Document // FUNÇÃO RESPONSÁVEL DE CONECTAR A UMA PAGINA EXTERNA NO NOSSO CASO A BUSCA_NOME.PHP // E RETORNAR OS RESULTADOS function pega(quem){ return document.getElementById(quem);}function ajaxGet(url,pega("pagina"),false){/****** * ajaxGet - Coloca o retorno de uma url em um elemento qualquer* Use a vontade mas coloque meu nome nos créditos. Dúvidas, me mande um email.* Versão: 1.2 - 20/04/2006* Autor: Micox - Náiron José C. Guimarães - micoxjcg@yahoo.com.br* Parametros:* url: string; elemento_retorno: object||string; exibe_carregando:boolean*  - Se elemento_retorno for um elemento html (inclusive inputs e selects),*	exibe o retorno no innerHTML / value / options do elemento*  - Se elemento_retorno for o nome de uma variavel*	(o nome da variável deve ser declarado por string, pois será feito um eval)*	a função irá atribuir o retorno à variável ao receber a url.*******/	var ajax1 = pegaAjax();	if(ajax1){		url = antiCacheRand(url)		ajax1.onreadystatechange = ajaxOnReady		ajax1.open("GET", url ,true);		ajax1.setRequestHeader("Cache-Control", "no-cache");		ajax1.setRequestHeader("Pragma", "no-cache");		if(false){ put("Carregando ...")	}		ajax1.send(null)		return true;	}else{		return false;	}	function ajaxOnReady(){		if(ajax1.status == 200){			var texto=ajax1.responseText;			if(texto.indexOf(" ")<0) texto=texto.replace(/\+/g," ");				put(texto);				extraiScript(texto);			/******* adicionei pra voce flavia ***/			pega("pagina").style.width = pega("nome").offsetWidth;			pega("pagina").style.left = pega("nome").offsetLeft + "px";			pega("pagina").style.top = (pega("nome").offsetTop + pega("nome").offsetHeight) + "px";			pega("pagina").style.visibility="visible"			/***** fim autocompletar flavia ***/			}else{				if(false){put("Falha no carregamento. " + httpStatus(ajax1.status));}			}	}	function put(valor){ 		if((typeof(pega("pagina"))).toLowerCase()=="string"){ 			if(valor!="Falha no carregamento"){ 				eval(pega("pagina") + '= unescape("' + escape(valor) + '")')			}		}else if(pega("pagina").tagName.toLowerCase()=="input"){			valor = escape(valor).replace(/\%0D\%0A/g,"")			pega("pagina").value = unescape(valor);		}else if(pega("pagina").tagName.toLowerCase()=="select"){					select_innerHTML(pega("pagina"),valor)		}else if(pega("pagina").tagName){			pega("pagina").innerHTML = valor;		}		}	function pegaAjax(){ 		if(typeof(XMLHttpRequest)!='undefined'){return new XMLHttpRequest();}		var axO=['Microsoft.XMLHTTP','Msxml2.XMLHTTP','Msxml2.XMLHTTP.6.0','Msxml2.XMLHTTP.4.0','Msxml2.XMLHTTP.3.0'];		for(var i=0;i<axO.length;i++){ try{ return new ActiveXObject(axO[i]);}catch(e){} }		return null;	}	function httpStatus(stat){ 		switch(stat){			case 0: return "Erro desconhecido de javascript";			case 400: return "400: Solicitação incompreensível"; break;			case 403: case 404: return "404: Não foi encontrada a URL solicitada"; break;			case 405: return "405: O servidor não suporta o método solicitado"; break;			case 500: return "500: Erro desconhecido de natureza do servidor"; break;			case 503: return "503: Capacidade máxima do servidor alcançada"; break;			default: return "Erro " + stat + ". Mais informações em [url=http://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html";]http://www.w3.org/Protocols/rfc2616/rfc261...c10.html";[/url] break;		}	}	function antiCacheRand(aurl){		var dt = new Date();		if(aurl.indexOf("?")>=0){			return aurl + "&" + encodeURI(Math.random() + "_" + dt.getTime());		}else{ return aurl + "?" + encodeURI(Math.random() + "_" + dt.getTime());}	}}function select_innerHTML(objeto,innerHTML){/****** * select_innerHTML - altera o innerHTML de um select independente se é FF ou IE* Corrige o problema de não ser possível usar o innerHTML no IE corretamente* Veja o problema em: [url=http://support.microsoft.com/default.aspx?scid=kb;en-us;276228]http://support.microsoft.com/default.aspx?...kb;en-us;276228[/url]* Use a vontade mas coloque meu nome nos créditos. Dúvidas, me mande um email.* Versão: 1.0 - 06/04/2006* Autor: Micox - Náiron José C. Guimarães - micoxjcg@yahoo.com.br* Parametros:* objeto(tipo object): o select a ser alterado* innerHTML(tipo string): o novo valor do innerHTML*******/	objeto.innerHTML = ""	var selTemp = document.createElement("micoxselect")	var opt;	selTemp.id="micoxselect1"	document.body.appendChild(selTemp)	selTemp = document.getElementById("micoxselect1")	selTemp.style.display="none"	if(innerHTML.toLowerCase().indexOf("<option")<0){		innerHTML = "<option>" + innerHTML + "</option>"	}	innerHTML = innerHTML.replace(/<option/g,"<span").replace(/<\/option/g,"</span")	selTemp.innerHTML = innerHTML	for(var i=0;i<selTemp.childNodes.length;i++){		if(selTemp.childNodes[i].tagName){			opt = document.createElement("OPTION")			for(var j=0;j<selTemp.childNodes[i].attributes.length;j++){				opt.setAttributeNode(selTemp.childNodes[i].attributes[j].cloneNode(true))			}			opt.value = selTemp.childNodes[i].getAttribute("value")			opt.text = selTemp.childNodes[i].innerHTML			if(document.all){ 				objeto.add(opt)			}else{				objeto.appendChild(opt)			}							}		}	document.body.removeChild(selTemp)	selTemp = null}function extraiScript(texto){//Maravilhosa função feita pelo SkyWalker.TO do imastersforum//http:forum.imasters.com.br/index.php?showtopic=165277&	var ini = 0;	while (ini!=-1){		ini = texto.indexOf('<script', ini);		if (ini >=0){			ini = texto.indexOf('>', ini) + 1;			var fim = texto.indexOf('</script>', ini);			codigo = texto.substring(ini,fim);			/**********************			* Alterado por Micox - micoxjcg@yahoo.com.br			* Alterei pois com o eval não executava funções.			***********************/			novo = document.createElement("script")			novo.text = codigo;			document.body.appendChild(novo);		}	}}

consulta

<?php if(!empty($_GET["valor"])){ 	// O CAMPO VALOR CONTERÁ O QUE O USUARIO DIGITOU ATÉ O MOMENTO.. 	// CONECTA AO BANCO COLOCA PARAMENTROS IP,USUARIO,SENHA 	include ('conexao.php');	$query = "SELECT * FROM sipesca.pescatb030_proprietario WHERE DE_PROPRIETARIO like UPPER('$_GET[valor]%')";	$statement = OCIParse ($conn, $query);	OCIExecute ($statement);	while (OCIFetchInto ($statement, $row, OCI_ASSOC)) {   		//print $row['NU_PROPRIETARIO'];		echo "<option value='".$row['NU_PROPRIETARIO']."'>".$row['DE_PROPRIETARIO']."</option>";   		//print $row['DE_PROPRIETARIO'];	}	ocilogoff($conn);}?>

oh micox, qto a publicar, fique a vontade!!! acho mesmo e q temos q compartilhar

Share this post


Link to post
Share on other sites

1) retire uma das funções pega(), tá com duas. Uma no script.js e outra na página mesmo2) Vá no Console de erros do firefox, limpe todos os erros, recarregue nossa página, faça a consulta novamente e veja se o FF retornou algum erro.3) Vá direto no endereço do browser e digite: busca_nome.php?valor=AlgumNome e veja se retorna alguma coisa. Seu erro pode estar no PHP.

Share this post


Link to post
Share on other sites

Ah, esqueci de postar comé que ficou meu php de teste pra função:

 

<option value="<?php echo $_GET["valor"]?>"><?php echo $_GET["valor"]?></option><option value="111">111</option><option value="222">222</option><option value="333">333</option><option value="444">444</option>

Só isso, nem uma tag a mais.

Share this post


Link to post
Share on other sites

Ops. tá errada, foi mal... Eu também mudei ela.O certo dela é assim:pega("pagina").style.top = (pega("nome").offsetTop + pega("nome").offsetHeight) + "px";Com ela to posicionando a página pra ficar logo abaixo do nome.

Share this post


Link to post
Share on other sites

bom dia micox... tu viu os erros acima.... porque que ta "Erro: ajaxGet is not defined"????tava testando agora, e ele apareceu uma opção de nome que eu ja havia digitado, como e que eu faço agora pra ele trazer as opções da consulta do banco?? isso ele nao ta trazendo.... vou dar uma checada no meu php

Share this post


Link to post
Share on other sites

ola micox.. ja to pra ficar doida com esse negocio.... :)bom, ja mudei tanta coisa no php, e nada resolve...ja testei a consulta a parte e ela ta trazendo dados redondinho.... no nosso codigo parece que ela nao ta recebendo aquele $_GET["valor"]!!!! e o que mais me intriga e que antes de comecarmos a modificar o code, a consulta funcionava bele....agora...... nao sei mesmo o que fazer.....

Share this post


Link to post
Share on other sites

Falou que o ajaxGet não existia porque tinha um erro dentro dele.Quando tem um erro dentro de uma função, ela não é gerada.Talvez o erro dentro do ajaxGet tá por causa de um comentário que pulou pra proxima linha e deixou de ser comentário. Olha: //ajax1.setRequestHeader("Content-Type", "text/html; charset=iso-8859-1");//"application/x-www-form-urlencoded");Será que é culpa dessa linha acima? Olha ela direitinho lá.

Share this post


Link to post
Share on other sites

apareceu os mesmos erros.... corrigi o lance dos comentarios, mas ate agora nada.... ele aparece beleza o nome que ja havia digitado em outro lugar, mas os nomes da consulta..... nem sonhando... :(

 

tem um erro que passa na linha 6(o primeiro erro) e aparece uma setinha apontando pra

function ajaxGet(url,pega("pagina"),false).... vou colocar novamente o erro aqui:

 

Erro: missing ) after formal parameters

Arquivo-fonte: http://localhost/ajax/teste/script1.js

Linha: 6

Código-fonte:

function ajaxGet(url,pega("pagina"),false){

Share this post


Link to post
Share on other sites

O código ainda tá como voce postou lá encima ou já alterou?Se tiver alterado, posta ele lá (editando) pra eu testar o sistema por completo.

Share this post


Link to post
Share on other sites

AAaaaaaaaaaaaaaaaaaaaaanãaao. Errinhos básicos de javascript.

Coisa simples mesmo. Era só voce ir lá na linha que o Firefox falou e olhar que voce já encontrava o erro.

 

Erro 1 no arquivo script1.js :

Voce alterou o cabeçalho da minha função ajaxGet. O pega("pagina") não pode ficar lá. Voce não pode alterar a declaração da função. O certo é do jeito que eu publiquei:

function ajaxGet(url,elemento_retorno,exibe_carregando)
Láaa na hora de chamar é que voce usa:

ajaxGet(url,pega("pagina"),true) sacou???

 

Erro 2:

O fórum aqui colocou uns textos em uma url que eu indiquei. É só voce corrigir e voltar ao que estava antes. A linha 79 deve ficar assim:

default: return "Erro " + stat + ". Mais informações em http://www.w3.org/Protocols/rfc2616/rfc261...c10.html";

Share this post


Link to post
Share on other sites

caracas, micox!!!! desculpa pelo meu erro!!!! puts!!! deu tudo certo!!!!Valeu mesmo pela paciencia, pela ajuda!!!!!!VALEU MESMO!!! muito obrigada por tudo!!!

Share this post


Link to post
Share on other sites

agora esta tudo funcionando certinho.. aparece a pesquisa certinha redondinha!!! valeu pela orientação, pela paciencia, mais uma vz!!!Flávia

Share this post


Link to post
Share on other sites

Uai. Voce tá aqui em valparaizo????Que milagre.A primeira pessoa de Goiás que eu vejo aqui no fórum, fora eu. hehaeh

Share this post


Link to post
Share on other sites

×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.