Ir para conteúdo
Fórum Script Brasil
  • 0

Ajuda aucomplete jquery mysql


michel vittoria

Pergunta

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>&nbsp; </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);

?>

cq0u.jpg

alguém já passou por esse problema e saberia resolve-lo?

Link para o comentário
Compartilhar em outros sites

1 resposta a esta questão

Posts Recomendados

  • 0

Tenta assim:

$("#nomevento").autocomplete({
source: function (request, response) {
$.ajax({
url: "ajax.php",
dataType: "jsonp",
data: {
q: request.term
},
success: function (data) {
response(data);
}
});
},
minLength: 0,
select: function (event, ui) {
$('#nomevento').val(ui.item.nomevento);
$('#estado').val(ui.item.estado);
$('#cidade').val(ui.item.cidade);
}
});

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152,3k
    • Posts
      652,5k
×
×
  • Criar Novo...