Submeter conteudo do autosugest quando clicar ou acionar botão enter

[E.Martins 0]

Bom estou querendo implementar na minha autossugestão a função de quando clicar no sugestão já pesquisar o conteúdo sem precisar aperta o botão submit.

Já vi alguns códigos só que não se encacham a minha necessidade, por isso estou pedindo ajuda aqui no fórum.

$(function() {
function log( message ) {
$( "body" ).scrollTop( 0 );
}
$( "#web" ).autocomplete({
source: "search.php",
minLength: 1,
select: function( event, ui ) {
log( ui.item ?
"Selected Topic: " + ui.item.value :
"Nothing selected, input was " + this.value);
}
});
});

Vale salientar que estou pegando as sugestões de um banco de dados, se alguem poder mim ajudar agradeço.

[angelorubin 142]

Eu montei um faz algum tempo de exemplo aqui para o fórum mesmo.

 

Veja - http://angelorubin.besaba.com/Imasters/JqueryUi/AutoComplete

 

É bem tranquilo, utilizei jQuery UI Autocomplete - http://jqueryui.com/autocomplete

 

É só fazer uma busca e retornar o resultado, segue o JS(jquery) do exemplo.

 

JS

$(function(){
	$("#linguagens").autocomplete({
		source: "busca.php",
		minLength: 3,
	})
})

PHP

<?php
//connect to your database
mysql_connect('host','user','senha');
mysql_select_db('nome_banco');
$term = trim(strip_tags($_GET['term']));//retrieve the search term that autocomplete sends

$qstring = "SELECT nome FROM linguagem WHERE nome LIKE '%".$term."%'";
$result = mysql_query($qstring);//query the database for entries containing the term

while ($row = mysql_fetch_array($result,MYSQL_ASSOC)) //loop through the retrieved values
{
		$row['nome'] = htmlentities(stripslashes($row['nome']));
		$row_set[] = $row['nome']; //build an array
}
echo json_encode($row_set); //format the array into json data
?>

OBS: O script já é antigo, então aconselho utilizar PDO na consulta para maior segurança.

 

Espero que ajude.

[E.Martins 0]

$(function() {
    function log( message ) {
      $( "body" ).scrollTop( 0 );
    }
 
    $( "#web" ).autocomplete({
		source: "search.php",
		minLength: 1,
		select: function( event, ui ){
			log( ui.item ?
			"Selected: " + ui.item.value :
			"Nothing selected, input was " + this.value );
			$("#web").val(ui.item.value); // Captura o item do sugest json
			$("form").submit(); // Submet o conteúdo do sugest json		
        }				
    });
	// Seleciona palavras digitadas e compara bom os terms do banco.
	$.ui.autocomplete.prototype._renderItem = function (ul, item){
		var highlighted = item.label.split(this.term).join('<strong>' + this.term +  '</strong>');
		return $("<li></li>")
		.data("item.autocomplete", item)
		.append("<a>" + highlighted + "</a>")
		.appendTo(ul);
	};
	
	$("#web").keyup(function() {
          $(this).val($(this).val().toLowerCase()); // Transforma maiusculas em minusculas.
    });
});

Na realidade resolvi o problema no proprio código json.

"$("#web").val(ui.item.value); $("form").submit();" estas duas linhas resoveram minha necessidade.