Jump to content
Webster Moitinho

Autocomplete - Seguir o link no SELECT

Recommended Posts

Implementei em meu site o JQuery Autocomplete e consegui fazer ele funcionar na boa. Porém não estou conseguindo fazer com que, quando o usuário pesquisar pelo termo, e selecionar na lista, ele seja direcionado para a respectiva página.

 

Meu código está assim:

<div id="pesquisa">  
	<form action="index.php?id=<?php echo $target; ?>&tp=smp" method="post" name="autocomplete" target="_self">
  		<strong>Pesquisa:</strong> 
  		<input id="autocomplete" title="Digite algo" placeholder="&nbsp;&nbsp;&nbsp;&nbsp;Digite algo">
		<button id="button-icon">Pesquise</button>
	</form>
</div><!--pesquisa-->  	

<script src="libraries/jquery.js"></script>
<script src="libraries/jquery-ui.js"></script>

<script>
<?php
$sql = "SELECT pags.id, pags.title, pags.keywords, pags.tema
		FROM pags
		WHERE vendavel = 'S'
		ORDER BY pags.id";

$resultado = $PDO->query( $sql );
$rows = $resultado->fetchAll(PDO::FETCH_ASSOC);
					
?>

  var availableTags = [

<?php
		foreach ($rows as $key => $linha) {
		$target = $linha['id'];
					

		echo '"' . $linha['title'] .' | ' . $linha['keywords'] . '",';
							}		
?>
		""
		];
		$( "#autocomplete" ).autocomplete({
			source: availableTags
		});
					
								
								
		$( "#button" ).button();
		$( "#button-icon" ).button({
			icon: "ui-icon-gear",
			showLabel: false
		});
								
</script>				
				

 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By ment0r
      Boa tarde a todos.
       
      Eu estou aproveitando a quarentena pra estudar e em aprofundar mais em JQuery. Comecei então um protótipo de PDV pra por em prática o aprendizado.
      Anexei uma imagem da tela. Basicamente é isso: o usuário digita um código e ao sair (blur), preenche o nome do produto e valor; quando o usuário clica em quantidade (keyup) faz o cálculo de valor unitário X qtde e exibe no campo total item. Quando o campo total item perde o foco (blur), os dados vão para o canto superior esquendo (conforme imagem) e ficam como linha daquela tabela.
       
      Só que quando eu faço uma nova consulta, ele apaga o registro anterior. O que eu queria é que quando eu pesquisasse um novo produto e fizesse o cálculo, armazenasse o segundo produto na linha de baixo e não apagasse o anterior.
      Esse trecho busca o valor e exibe nos campos - tudo ok aqui.
      // Pega o valor digitado no campo código // Passa como parametro para função buscaProduto codigo.blur(function(){ if (codigo.val() != '') { buscaProduto(codigo.val()); } else { alert('Por favor, digite algum valor no campo código'); codigo.focus(); } }); // Função responsável por buscar os dados do produto function buscaProduto(codigo){ $.ajax({ url : "busca_produto.php", type : 'post', cache: false, // não mantém os dados em cache dataType: 'json', // não é necessário passar quando é html data : { cod : codigo }, success: function(msg){ produto.val(msg.NOME); valor.val(msg.PRECO); quantidade.focus(); } }) } Esse trecho adiciona a linha dos dados na tabela do canto superior esquerdo.
      // Executa a função preencheDados quando o input #total_item perde o foco total_item.blur(function(){ preencheDados(codigo.val(), produto.val(), quantidade.val(), valor.val(), total_item.val()) }) // Preeche os dados calculados na tela function preencheDados(codigow, produtow, quantidadew, valorw, total_itemw){ th = '<th>1</th>'; th += '<th>'+codigow+'</th>'; th += '<th>'+produtow+'</th>'; th += '<th>'+quantidadew+'</th>'; th += '<th>'+valorw+'</th>'; th += '<th>'+total_itemw+'</th>'; destino.html(th); descricao.val(produtow); valor_down.val(valorw); quantidade_down.val(quantidadew); total_item_down.val(total_itemw); sub_total.val('Calcular...'); codigo.val('').focus(); produto.val(''); quantidade.val(''); valor.val(''); total_item.val(''); } Se alguém puder me dar uma dica de como adicionar essa segunda linha (th) eu agradeço muito.
       
      Um abraço a todos.

    • By marsolim
      fala rapaziada tudo bem? sabe me dizer se tem diferença de performance, de compatibilidade e etc e tal entre o jquery $(this).val() e o javascript puro this.value? tava tentando pesquisar aqui mas não achei nada sobre.
      grato
    • By juliosertori
      Olá boa tarde, tudo bem?
       
      Tenho uma consulta de CEP via AJAX, na qual ele seleciona a cidade no SELECT cidades:
       
      $("#cidade").val(dados.localidade);
       
      O problema é que tem que estar exatamente igual nos 2 lados, na consulta e no select.
       
      Como fazer para não diferenciar minúsculas e maiúsculas, e caracteres especiais?
       
      Obrigado!
    • By juliosertori
      Olá tudo bem?
       
      Tenho campos de produtos que somam os valores e multiplicam pela quantidade, na maioria das vezes o valor sai corretamente em um INPUT com MASK de Moeda, mas alguns valores sai por exemplo dessa forma:
       
      8984.960000000001
       
      O que faz com que não fique corretamente para mandar no POST e tratar os dados depois, na maioria das vezes ele vem correto, por exemplo:
       
      R$ 8,898.10
       
      Não encontrei uma forma dele tratar quando tiver várias casas ele concertar etc.
    • By Carcleo
      Pessoal, bom dia!
       
      Tenho o código abaixo que faz um efeito de parallax e está funcionando normalmente
      CSS
      #top {     background: url("img/1.jpg");     height: 300px; } #mid {     background: url("img/2.jpg");     height: 400px; } #bot {     background: url("img/3.jpg");     height: 500px; } HTML
      <script type="text/javascript" src="jquery.js"></script>   <body>   <div id="top" class="prlx"></div>   <div id="mid" class="prlx"></div>   <div id="bot" class="prlx"></div> </body>  JQUERY
      $('.prlx').each(function() {        var obj = $(this);        obj.css('background-position', 0);     obj.css('background-attachment', 'fixed');        $(window).scroll(function() {     var offset = obj.offset();     var yPos = -($(window).scrollTop() - offset.top) / 10;     var bgpos = '50% ' + yPos + 'px';     obj.css('background-position', bgpos);   });    }); Fui aplicar no meu site 
       
      https://acweb.net.br/
       
      e o efeito parallax não funcionou embora no inspector dá para ver os cálculos sendo feitos e adicionado às sections
       
      Alguém me ajuda a descobrir onde errei?
       
      Já estou faz um tempão e não acho!
       
      As sections afetadas são as que começam com os textos
       
      Fazemos todo o trabalho por você e contato, 
×

Important Information

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