Ir para conteúdo

Arquivado

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

  • 0
Jack Oliveira

CAIXA DE PESQUISA HTML

Perguntado por Jack Oliveira

Pergunta

Jack Oliveira    1

Jack Oliveira
Postado

Ola alguém poderia me informa como posso usar um auto preenchimento quando vai pesquisar ou melhor

conforme a pessoa vai digitando as letras vai aparecendo os nome referentes as letras que esta sendo digitadas

 

por EX: se eu digitar em pesquisar a letras  ab

                                                                               Abelha

                                                                               Aberto

                                                                              Abrir

 

aqui esta meu codigo do HTML da caixa de pesquisa

  

<style type="text/css">

#caixa-b-1 {

	text-align: center;

	margin: 0;

          height: 80px;

	width: 100%;

	padding: 0px 16px;

	display: inline-block;

	border: solid 0px #D2D2D2;

	-moz-border-radius: 2px;

	-webkit-border-radius: 2px;

	-goog-ms-border-radius: 2px;

	border-radius: 2px;

	

}

#pesquisar-form-b-1 {

	font:  normal bold 23px Arial, Tahoma, Helvetica, FreeSans, sans-serif;

	padding: 25px;

	color: #000;

	border: 1px solid #D2D2D2;

	background: #FFF;

          height: 29px;

          width: 540px;

	-moz-border-radius: 5px;

	-webkit-border-radius: 5px;

	-goog-ms-border-radius: 5px;

	border-radius: 0px;

	-webkit-box-shadow: 1px 1px 2px rgba(0,0,0,0.30) inset;

	-moz-box-shadow: 1px 1px 2px rgba(0,0,0,0.30) inset;

	box-shadow: 1px 1px 2px rgba(0,0,0,0.30) inset;

}

#submit-button-b-1 {

	color: #435444;

	margin: 0 0 0 9px;

	height: 80px;

          width: 200px;

	border: 1px solid #DDD;

	font: normal bold 22px Arial, Tahoma, Helvetica, FreeSans, sans-serif; 

	text-shadow: 0 2px 2px rgba(0,0,0,0);

	-moz-border-radius: 5px;

	-webkit-border-radius: 5px;

	-goog-ms-border-radius: 5px;

	border-radius: 0px;

	background: #000000;

	background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#FFFFFF));

	background: -moz-linear-gradient(top, #000000, #);

}

</style>

<div id="caixa-b-1"><form action="http://localhost/cidade/listagem_de-busca.php" method="GET" name="input" target="frm-index2">

<input id="pesquisar-form-b-1" name="pesquisar" type="text" autocomplete="off" placeholder="Pesquise por empresas, segmento ou servição..." x-webkit-speech="x-webkit-speech" /><input id="submit-button-b-1" type="submit" value=" Pesquisar " /></form></div>

               

Compartilhar este post

Link para o post
Compartilhar em outros sites

2 respostas a esta questão

Recommended Posts

Jack Oliveira    1

Jack Oliveira
Postado
Em 08/11/2017 at 13:08, quintelab disse:

Da uma olhada: https://jqueryui.com/autocomplete/

Ola quintelab seria isso 

sim mais aqui vou ter que criar os nomes certo pois eu quero que quando for digitando ele puxar da tabela os nome 


 
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>jQuery UI Autocomplete - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$( function() {
var availableTags = [
"ActionScript",
"AppleScript",
"Asp",
"BASIC",
"C",
"C++",
"Clojure",
"COBOL",
"ColdFusion",
"Erlang",
"Fortran",
"Groovy",
"Haskell",
"Java",
"JavaScript",
"Lisp",
"Perl",
"PHP",
"Python",
"Ruby",
"Scala",
"Scheme"
];
$( "#tags" ).autocomplete({
source: availableTags
});
} );
</script>
</head>
<body>
 
<div class="ui-widget">
<label for="tags">Tags: </label>
<input id="tags">
</div>
 
 
</body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para lista de Perguntas Perguntas e respostas rápidas

  • Conteúdo Similar

    • btpdsnb
      Pesquisa sobre fatores de retenção para Desenvolvedore de Software
      Por btpdsnb
      Boa tarde, pessoal!
      Meu nome é Rodrigo e sou aluno de graduação da FEA-USP. Meu grupo está realizando uma pesquisa para analisar o que motiva e retém os desenvolvedores de software nas organizações do Brasil.
      Acreditamos que este tipo de pesquisa pode ajudar as empresas a entenderem os principais fatores de retenção e gerir melhor as práticas de gestão de pessoas adotadas para retê-los.
      Todos os dados pessoais coletados serão confidenciais, utilizados exclusivamente para fins acadêmicos.
      Aos que puderem responder, o questionário leva de 5 a 8 minutos para ser respondido.
      Link do formulário: https://docs.google.com/forms/d/1izmjInl_uuTgjIaQUF7Lk6rh7OudSy6MoBRugiMQdic/viewform?edit_requested=true
    • FelipeCostaFT
      Mercado de trabalho de programação - Ajuda com pesquisa para Startup
      Por FelipeCostaFT
      Estou iniciando uma startup para ajudar os devs a entrarem no mercado de trabalho mais preparados
      e, por isso, com maior chance de arrumar um bom emprego.

      Mas gostaria de saber como está sendo a realidade de vocês nesse momento de encarar o mercado.
      Alguém já está nessa fase ou até dentro do mercado poderia me ajudar? Esse forms dura 1 minuto pra
      responder e vai nos auxiliar a descobrir como ajudá-los a chegar lá mais rápido.
       
      link do forms
    • Spy_brbr
      Pesquisas em arquivos PDF utilizando Apache Solr ou ElasticSearch
      Por Spy_brbr
      Tenho um sistema em PHP que funciona como um tipo de repositório para documentos. No início a ideia era apenas realizar pesquisas pelo título ou tipo de documento, mas andei lendo sobre algumas ferramentas como Apache Solr ou ElasticSearch que realizazam a indexação dos arquivos e permite realizar as buscas dentro de arquivos PDF, DOC, etc. Alguém já utilizou essas ferramentas ?
    • Jefferson andre
      fazer uma pesquisa independente da letra ser maiscula ou minuscula
      Por Jefferson andre
      Ola, Tenho uma lista de nomes de clientes escritas sem nenhum padrao de maiscula e minuscula e preciso fazer uma pesquisa nelas. O usuario vai digitar sem nenhum padrao. Entao preciso que todo o conteudo da lista e o campo digitado pelo usuario seja convertido para maisucula/minuscula e a pesquisa seja feita.   Exemplo: JEFFERSON rose Nicolas ROSEMEIRE   PESQUISAR POR: Ro   RETORNO DA PESQUISA: rose ROSEMEIRE   Como fazer isso em javascript ? preciso de um exemplo se tiver ok
    • Alberto Nascimento
      [RESOLVIDO] Não estou conseguindo exibir os dados do registro específico ( como pesquisar pelo Código )
      Por Alberto Nascimento
      Estou tentando, mas não esta exibindo o registro...
       
      localizar.php
       
      <?php session_start(); $_SESSION["localizarfotografia"] = $_POST["codphoto"]; ?> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>EXIBIR FOTOGRAFIA PELO CÓDIGO INTERNO</title> <style type="text/css"> <!-- .Style6 {font-size: 13px} .auto-style20 { text-align: center; } .auto-style22 { background-color: #FEB624; } .auto-style23 { font-family: Verdana, Geneva, Tahoma, sans-serif; font-size: xx-small; text-align: center; } .auto-style25 { background-color: #FFCC66; } .auto-style26 { font-size: x-small; } .auto-style27 { font-size: x-small; text-align: center; } .auto-style28 { text-align: center; background-color: #FEB624; } --> </style> </head> <body style="margin-top: 50"> <body onload="form1.login.focus();"> <form id="form1" name="form1" method="post" action="pesquisaragora.php"> <div class="auto-style20"> <table align="center" cellpadding="0" cellspacing="0" class="auto-style23" style="width: 500"> <tr> <td class="auto-style20"> &nbsp;</td> </tr> <tr> <td class="auto-style22"> &nbsp;</td> </tr> <tr> <td class="auto-style25" style="height: 41px">Informe o código da FOTOGRAFIA abaixo</td> </tr> <tr> <td class="auto-style25"> <table align="center" style="width: 450"> <tr> <td class="auto-style27"><span class="Style6"> <label> <input name="codphoto" type="text" id="codphoto" style="width: 305px; height: 83px;" /></label></span></td> </tr> <tr> <td class="auto-style26"><strong> </strong></td> </tr> <tr> <td class="auto-style20"><span class="Style6"> <label> <input type="submit" name="Submit" value="LOCALIZAR PHOTO" /></label></span></td> </tr> </table> </td> </tr> <tr> <td class="auto-style25">&nbsp;</td> </tr> <tr> <td class="auto-style28"> &nbsp;</td> </tr> </table> <br></div> </form> </body> </html>  
      pesquisarphoto.php
       
      <?php include("config.php"); $codphoto = $_POST['codphoto']; $sql_logar = "SELECT * FROM photos WHERE codphoto = '$codphoto'"; $exe_logar = mysql_query($sql_logar) or die (mysql_error()); $fet_logar = mysql_fetch_assoc($exe_logar); $num_logar = mysql_num_rows($exe_logar); $codphoto = $fet_logar['codphoto']; $nome = $fet_logar['nome']; $cidade = $fet_logar['cidade']; $uf = $fet_logar['uf']; if ($num_logar == 0){ echo "Desculpe, mas a foto não foi localizada."; echo "<br><a href='javascript:window.history.go(-1)'>Clique aqui e tente novamente.</a>"; } else{ session_start(); $_SESSION['codphoto'] = $codphoto; $nome = $fet_logar['nome']; $cidade = $fet_logar['cidade']; $uf = $fet_logar['uf']; echo $exibir["codphoto"]; echo $exibir["nome"]; echo $exibir["cidade"]; echo $exibir["uf"]; } ?>  
       
       
       
       
       
       
       
       
×

Informação importante

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

  Aceito