Bom dia,
Estou desenvolvendo um projeto, onde o mesmo utiliza aucomplete, com dados vindos do mysql, ele funciona, mas o campo utilizado como gatilho para chamar a função fica em branco e as informações que deveriam aparecer para seleção também estão em branco.
O autocomplete é para varios campos, que são preenchidos, menos o campo para chamar as informações.
Formulário
<?php
include("banco/config.php");
include("eventos.php");
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="css/imagens/ico.png" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Cadastro de Evento</title>
<link href='http://fonts.googleapis.com/css?family=Oswald:400,700,300|Roboto+Condensed:300italic,400italic,700italic,400,300,700' rel='stylesheet' type='text/css'/>
<!--jquery auto complete -->
<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<!--<link rel="stylesheet" type="text/css" href="css/mobile.css" media="all and (max-width : 320px)">
<link rel="stylesheet" type="text/css" href="css/style.css" media="all and (min-width : 941px)" />-->
<link rel="stylesheet" type="text/css" href="css/style3.css"/>
<!--Inicio Java Script validar campos-->
<script type="text/javascript">
function valida(form) {
if (form.nomevento.value=="") {
alert("Preencha o nome do evento ");
form.nomevento.focus();
return false;
}
if (form.estado.value=="") {
alert("Preencha o estado do evento");
form.estado.focus();
return false;
}
if (form.cidade.value=="") {
alert("Preencha a cidade do evento corretamente.");
form.cidade.focus();
return false;
}
}
</script>
<!--auto completar-->
<script type="text/javascript">
$(function() {
var availableTags = [
"Acre",
"Alagoas",
"Amapa" ,
"Amazonas",
"Bahia" ,
"Ceara" ,
"Distrito Federal",
"Goias" ,
"Espirito Santo",
"Maranhao" ,
"Mato Grosso",
"Mato Grosso do Sul",
"Minas Gerais" ,
"Para" ,
"Paraiba",
"Parana" ,
"Pernambuco",
"Piaui" ,
"Rio de Janeiro",
"Rio Grande do Norte",
"Rio Grande do Sul" ,
"Rondonia" ,
"Roraima" ,
"Sao Paulo",
"Santa Catarina",
"Sergipe" ,
"Tocantins",
];
$( "#estado" ).autocomplete({
source: availableTags
});
});
$(document).ready(function() {
$("#nomevento").autocomplete({
source: "ajax.php",
minLength: 0,
select: function(event, ui) {
$('#nomevento').val(ui.item.nomevento);
$('#estado').val(ui.item.estado);
$('#cidade').val(ui.item.cidade);
}
});
});
</script>
</head>
<body>
<div id="barra">
<table width="100" border="1">
<tr>
<div id="logon">
<a href="logout.php" title="logon">LOGOUT</a>
</div>
</tr>
</table>
</div>
<div id="login">
<div class="message bradius"></div>
<div class="logo"><a href="http://www.brunswick.com/" title="Brunswick.com"><img src="css/imagens/LOGO.png"alt="<?php echo $title;?>"title="<?php echo $title;?>"width="280"height=60/></a> </div>
<div class="acomodar">
<form onsubmit="return valida(this);" action="eventos.php" method="POST">
<div class=""></div>
<p>
<label for="evento">Nome do Evento: </label>
<input id="nomevento" type="text" class="txt bradius" name="nomevento" value="" aling="center" autocomplete="off" />
<label for="estado">Estado do Evento: </label>
<input id="estado" type="text" class="txt bradius" name="estado" value="" autocomplete="off" />
</p>
<p>
<label for="cidade">Cidade do Evento: </label>
<input id="cidade" type="text" class="txt bradius" name="cidade" value="" autocomplete="off" />
</p>
<table width="254" border="0">
<tr>
<td width="132"><input type="submit" class="sb bradius" id="btnCad" value="Cadastrar" name="cadastro" /></td>
<p> </p>
<td width="112"><input type="submit" class="sb bradius" id="btnAlt" value="Alterar" name="alterar"/></td>
</tr>
</table>
</form>
<!--acomodar-->
</div>
<!--fecha div login-->
</div>
</body>
</body>
</html>
Autocomplete
<?php
/* Connection vars here for example only. Consider a more secure method. */
$dbhost = 'localhost';
$dbuser = 'root';
$dbpass = 'root';
$dbname = 'sistema';
$conn = mysql_connect($dbhost, $dbuser, $dbpass) or die ('Erro ao conectar ao banco');
mysql_select_db($dbname);
$return_arr = array();
if ($conn)
{
$fetch = mysql_query("SELECT * FROM evento where nomevento like '%" . mysql_real_escape_string($_GET['term']) . "%'");
while ($row = mysql_fetch_array($fetch, MYSQL_ASSOC)) {
$row_array['nomevento'] = $row['nomevento'];
$row_array['estado'] = $row['estado'];
$row_array['cidade'] = $row['cidade'];
array_push($return_arr,$row_array);
}
}
mysql_close($conn);
echo json_encode($return_arr);
?>
alguém já passou por esse problema e saberia resolve-lo?