Mediante el siguiente artículo explican como hacer un "buscador live" al estilo de Google...
Y así lo implemente (obviamente lo modifique a mis necesidades...), pero tengo un problema por ejemplo yo necesito mostrar algunos resultados que incluyen acentos...
index.html
Código HTML:
<html>
<head>
<title>Search intstant</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="es-mx" />
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="instant.js"></script>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<form method="GET" action="">
<input type="text" id="q" name="q" />
<input type="submit" value="Search" />
</form>
<div id="results"></div>
</body>
</html>
instant.js
Código:
$(document).ready(function(){
var runningRequest = false;
var request;
$('input#q').keyup(function(e){
e.preventDefault();
var $q = $(this);
if($q.val() == ''){
$('div#results').html('');
return false;
}
//Abort opened requests to speed it up
if(runningRequest){
request.abort();
}
runningRequest=true;
request = $.getJSON("buscar.php",{
q:$q.val()
},function(data){
showResults(data,$q.val());
runningRequest=false;
});
function showResults(data, highlight){
var resultHtml = '';
$.each(data, function(i,item){
resultHtml+='<div class="result">';
resultHtml+='<h2>Nombre: <a href="ver.php?id='+item.id+'">'+item.nombre+'</a></h2>';
resultHtml+='<p>Estado: '+item.estado+'.</p>';
resultHtml+='</div>';
});
$('div#results').html(resultHtml);
}
$('form').submit(function(e){
e.preventDefault();
});
});
});
buscar.php
Código PHP:
<?php
if(!empty($_GET['q'])) {
buscar();
}
function buscar() {
include("3li.inc"); //configuración de mi base de datos
//$q = mysql_real_escape_string($_GET['q'], $conexion);
$q = $_GET['q'];
$sql = mysql_query("
SELECT
id, nombre, estado,
FROM redes
WHERE cp LIKE '%{$q}%' OR estado LIKE '%{$q}%'
");
$results=array();
while($v = mysql_fetch_object($sql)){
$results[] = array(
'id'=>$v->id,
'ssid'=>$v->nombre,
'estado'=>$v->estado
);
}
echo json_encode($results);
//print_r($results);
}
?>
Si ven mi buscador es sencillo muestra el nombre de un usuario, así como el estado donde vive, y el buscador funciona con el código postal o directamente buscando el estado/provincia, pero si el estado/provincia tiene el problema de que muestra nada, y si veo el
array muestra un valor
"null"