Como hacer un Buscador con Ajax
En este post ahora trataré de explicar como crear un buscador utlizando AJAX:
Mucho de esto, fue código que implementé hace mucho tiempo, y aunque existen mejores o mas sencillas formas de hacerlo utilizando algun framework, trataré de explicar la forma en que trabajé cuando me inicié en esto de AJAX
Antes de continuar, aquí pueden ver el resultado final o descargar el ejemplo completo:
Antes de iniciar, describiré brevemente los archivos con los cuales consiste el buscador:
- /buscador.php Este archivo es la estructura de todo el buscador.
- /busqueda.php Este archivo es lo mismo que buscador.php con la diferencia de que le quitamos todo, menos lo que está entre el div resultados: <HTML>...<div id="resultados">...</div></BODY></HTML>. Esto con la finalidad de llamar este archivo para obtener las búsquedas y mostrarlas con AJAX sin recargar todo el sitio nuevamente.
- /buscador.js Aquí están incluídos las funciones básicas para el funcionamiento del buscador.
- /buscador.css Le da una bonita apariencia el buscador.
- /include/funciones.php Aquí sólo guardamos: sql_quote para el filtrado de las consultas que se necesiten ejecutar.
- /include/pagination.class.php Aquí descripción
- /config.php Aquí la configuración básica para el funcionamiento del buscador. Host, usuario, password, base de datos.
Ahora, trataré de describir a detalle la finalidad de cada archivo:
buscador.php
Primero que nada incluimos los archivos necesarios para su funcionamiento. Más adelante pondré la explicación más a detalle de cada uno.
require('config.php');
require('include/conexion.php');
require('include/funciones.php');
require('include/pagination.class.php');
Determino cuantos elementos se mostrarán por página y en que página estoy inicialmente (o por defecto). Estos dos datos son para ir limitando la consulta SQL que traerá los resultados de la búsqueda y en este otro artículo del Blog explico bien como paginar las consultas SQL, ya que internamente también estaré utilizando la clase para paginación de resultados.
$page = 1;
if(isset($_GET['page']) and is_numeric($_GET['page']) and $page = $_GET['page'])
$limit = " LIMIT ".(($page-1)*$items).",$items";
else
$limit = " LIMIT $items";
En esta parte verifico si existe la variable q. La variable q estará presente en caso de que se haya introducido una búsqueda.
//Realizamos la búsqueda de q en los registros
}else{
//Mostramos los registros disponibles ya que no hay nada por buscar
}
Aquí lo que falta en el código del párrafo anterior: En caso de que si esté definida la variable q (para eso utilizo la función isset()), me aseguro que no esté formada por sólo espacios para asegurarme de que en realidad estoy buscando algo (para eso utilizo eregi() apoyándome de la expresión ^ *$ que significa algo así: "que inicie y termine con un espacio en blanco que se repita desde 0 a infinito veces")
$q = sql_quote($_GET['q']); //para ejecutar consulta
$busqueda = htmlentities($q); //para mostrar en pantalla
$sqlStr = "SELECT * FROM preguntas WHERE pregunta LIKE '%$q%'";
$sqlStrAux = "SELECT count(*) as total FROM preguntas WHERE pregunta LIKE '%$q%'";
}else{
$sqlStr = "SELECT * FROM preguntas";
$sqlStrAux = "SELECT count(*) as total FROM preguntas";
}
La función sql_quote sirve para filtrar la cadena y evitar inyecciones de código SQL. Está almacenada en el archivo includes/funcions.php que también explicaré mas adelante.
En este paso (creo yo que sería el más complicado ya que estamos trabajando con consultas SQL) estoy haciendo 2 cosas:
- Creando una consulta que devuelva todos los registros que necesitamos (SELECT * FROM preguntas WHERE pregunta LIKE '%$q%').
- y creando ésta otra que únicamente devuelva la cantidad de registros ("SELECT count(*) as total FROM preguntas WHERE pregunta LIKE '%$q%').
No se que tan complicado pueda ser esta paso para todos, especialmente para ti Stan 
,... pero cualquier duda por favor
en los comentarios y las vamos resolviendo entre todos los que gusten participar.
Voy a suponer que la mayoría sabe como funciona esto de las consultas SQL y continuaré.
Ahora, en el paso que sigue, ejecutamos ambas consultas y seguido de eso estructuramos el HTML que formará el buscador:
$query = mysql_query($sqlStr.$limit, $link);
?>
En el paso anterior, a la segunda consulta le concatené la variable que habíamos preparado para limitar la cantidad de registros ($limit) que traeríamos según la página en la que estuviéramos ($sqlStr.$limit).
En este paso, comenzamos a estructurar el HTML: Incluimos la hoja de estilo CSS del paginador, el estilo CSS para mostrar las tablas con los resultados, y el archivo include/buscador.js (otro de los importantes en el funcionamiento del buscador)
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Buscador en AJAX</title>
<link rel="stylesheet" href="pagination.css" media="screen">
<link rel="stylesheet" href="style.css" media="screen">
<script src="include/buscador.js" type="text/javascript" language="javascript"></script>
</head>
<body>
Creamos la caja de búsqueda:
<label>Buscar</label> <input type="text" id="q" name="q" value="<?php if(isset($q)) echo $busqueda;?>" onKeyUp="return buscar()">
<input type="submit" value="Buscar" id="boton">
<span id="loading"></span>
</form>
Este es el formulario para realizar la búsqueda, en el encontraremos tres puntos a destacar:
- onsubmit="return buscar()": Al enviar el formulario o dar clic en buscar, se ejecutará la función buscar().
- onKeyUp="return buscar()": El momento en que ejecutará la función buscar() será al quitar el dedo de la tecla (onKeyUp).
- <span id="loading"></span>: Ahí aparecerá la animación
cuando el contenido esté siendo cargado.
La función buscar() está almacenada en include/buscador.js
Por último ya mostrar los resultados de las consultas SQL ejecutadas.
Está parte está formada básicamente y a grandes rasgos por:
<!-- Aquí van los registros -->
</div>
Dentro <div id="resultados"> ... </div> aparecerán los resultados, y al momento de dar clic en buscar o ejecutar la funcion buscar() que está contenida dentro de include/buscador.js y es accionada por el formulario anterior, este div se actualizará con los nuevos resultados.
Tomando en cuenta que lo que está dentro del div anterior, es únicamente los resultados de búsqueda, y que estos se estarán mandando llamar cada que uno ejecute la búsqueda: Esto lo separé en el archivo busqueda.php (Este lo mandamos llamar cada que buscar() se ejecuta, y actualizamos el contenido del div con los que nos devuelva el archivo busqueda.php):
<p><?php
if($aux['total'] and isset($q)){
echo "{$aux['total']} Resultado".($aux['total']>1?'s':'')." que coinciden con tu búsqueda \"<strong>$busqueda</strong>\".";
}elseif($aux['total'] and !isset($q)){
echo "Total de registros: {$aux['total']}";
}elseif(!$aux['total'] and isset($q)){
echo"No hay registros que coincidan con tu búsqueda \"<strong>$busqueda</strong>\"";
}
?></p>
<?php
if($aux['total']>0){
$p = new pagination;
$p->Items($aux['total']);
$p->limit($items);
if(isset($q))
$p->target("index.php?q=".urlencode($q));
else
$p->target("index.php");
$p->currentPage($page);
$p->show();
echo '<ul>';
while($row = mysql_fetch_assoc($query))
echo "<li>".htmlentities($row['pregunta'])."</li>";
echo '</ul>';
$p->show();
}
?>
</div>
</body>
</html>
Dentro de este último bloque de código validamos que haya resultados para despues de eso paginarlos con ayuda de la clase de paginación (y el artículo sobre como paginar) y por último un ciclo en el que vamos mostrando los resultados.
Un punto que posiblemente pueda causar duda en el código anterior: cuanto intento cambiar a donde apunta la paginación de manera que los enlaces apunten a algo así (En caso de haber una busqueda):
- buscador.php?q=busqueda&page1
- buscador.php?q=busqueda&page2
- etc
A la busqueda le aplico la función urlencode, para que la búsqueda en caso de tener símbolos especiales me permita introducirlos como una URL. Aunque, recomiendo mejor leer las especificaciones que nos dan en la documentación de php: http://php.net/urlencode
else
$p->target("index.php");
Cualquiera de todos los puntos anteriores puedo profundisarlo, sólo cuestion de dejarlo en los comentarios. (Uff, me está costando trabajo escribir esto,... voy por el 2do café.)
busqueda.php
Este archivo está formado básicamente por lo que está dentro de <div id="resultados"> ... </div> en buscador.php. Únicamente nos sirve para traer resultados mediante AJAX.
require('config.php');
require('include/conexion.php');
require('include/funciones.php');
require('include/pagination.class.php');
$items = 10;
$page = 1;
if(isset($_GET['page']) and is_numeric($_GET['page']) and $page = $_GET['page'])
$limit = " LIMIT ".(($page-1)*$items).",$items";
else
$limit = " LIMIT $items";
if(isset($_GET['q']) and !eregi('^ *$',$_GET['q'])){
$q = sql_quote($_GET['q']); //para ejecutar consulta
$busqueda = htmlentities($q); //para mostrar en pantalla
$sqlStr = "SELECT * FROM preguntas WHERE pregunta LIKE '%$q%'";
$sqlStrAux = "SELECT count(*) as total FROM preguntas WHERE pregunta LIKE '%$q%'";
}else{
$sqlStr = "SELECT * FROM preguntas";
$sqlStrAux = "SELECT count(*) as total FROM preguntas";
}
$aux = Mysql_Fetch_Assoc(mysql_query($sqlStrAux,$link));
$query = mysql_query($sqlStr.$limit, $link);
?> <p><?php
if($aux['total'] and isset($busqueda)){
echo "{$aux['total']} Resultado".($aux['total']>1?'s':'')." que coinciden con tu búsqueda \"<strong>$busqueda</strong>\".";
}elseif($aux['total'] and !isset($q)){
echo "Total de registros: {$aux['total']}";
}elseif(!$aux['total'] and isset($q)){
echo"No hay registros que coincidan con tu búsqueda \"<strong>$busqueda</strong>\"";
}
?></p>
<?php
if($aux['total']>0){
$p = new pagination;
$p->Items($aux['total']);
$p->limit($items);
if(isset($q))
$p->target("index.php?q=".urlencode($q));
else
$p->target("index.php");
$p->currentPage($page);
$p->show();
echo "\t<table class=\"registros\">\n";
echo "<tr class=\"titulos\"><td>Titulo</td></tr>\n";
$r=0;
while($row = mysql_fetch_assoc($query)){
echo "\t\t<tr class=\"row$r\"><td><a href=\"http://www.mis-algoritmos.com/?p={$row['id']}\" target=\"_blank\">".htmlentities($row['pregunta'])."</a></td></tr>\n";
if($r%2==0)++$r;else--$r;
}
echo "\t</table>\n";
$p->show();
}
?>
include/buscador.js
En este archivo están almacenadas las dos funciones más importantes para permitirle la funcionalidad con AJAX al buscador:
- xmlhttp() que crea una instancia del objeto con el que trabajaré las funciones de AJAX. (Esta función la conseguí en este artículo de anieto2k que escribió hace ya algo de tiempo)
- Y buscar() que ejecuta la búsqueda y devuelve al resultado a buscador.php para mostrarlo y dar el efecto que buscamos.
Aquí la función xmlhttp() que únicamente crea el objeto para trabajar con AJAX
var xmlhttp;
try{xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");}
catch(e){
try{xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");}
catch(e){
try{xmlhttp = new XMLHttpRequest();}
catch(e){
xmlhttp = false;
}
}
}
if (!xmlhttp)
return null;
else
return xmlhttp;
}
Y aquí la función buscar(). Esta es importante, así que me voy describiendo casi línea por línea.
var query = document.getElementById('q').value;
var A = document.getElementById('resultados');
var B = document.getElementById('loading');
var ajax = xmlhttp();
ajax.onreadystatechange=function(){
if(ajax.readyState==1){
B.innerHTML = "<img src='images/loading.gif' alg='Loading...'>";
}
if(ajax.readyState==4){
A.innerHTML = ajax.responseText;
B.innerHTML = "";
}
}
ajax.open("GET","busqueda.php?q="+encodeURIComponent(query),true);
ajax.send(null);
return false;
}
Creamos tres variables: A, B y ajax (El nombre no importa).
En la variable A y B estoy utilizando document.getElementById('elemento'), que nos permite acceder a las propiedades de cualquier elemento HTML que esté representado de alguna forma en el navegador. En la página de Mozilla está detallado con palabras más entendibles: http://developer.mozilla.org/en/docs/DOM:document.getElementById.
var A = document.getElementById('resultados');
var B = document.getElementById('loading');
var ajax = xmlhttp();
A = document.getElementById('resultados'); nos permitirá manipular el DIV resultados
(<div id="resultados"> en donde sustituiremos los resultados que nos devuelva busqueda.php), y
con B = document.getElementById('loading'); controlaremos el contenido de <span id="loading"></span>,
en donde pondremos la imagen cuando el objeto AJAX esté trabajando.
ajax.onreadystatechange=function(){ ... } permite estar a la escucha de cuando sucede un cambio en el objeto AJAX (Estos cambios está explicados aquí). Por el momento, sólo utilizaré dos de ellos:
- 1 (Cargando)
- Y 4 (Terminado)
Creo que esta información es suficiente para comprender que if(ajax.readyState==1){...}, debo mostrar la imagen cargando, y que si if(ajax.readyState==4){...}, entonces debo mostrar el resultado de las búsquedas.
Para poder hacer esto utilizaremos innerHTML, que nos permite obtener o cambiar el contenido de un elemento HTML. En la página de Mozilla está detallado con palabras más entendibles: http://developer.mozilla.org/en/docs/DOM:element.innerHTML.
Por lo que, con B.innerHTML = "<img src='images/loading.gif' alg='Loading...'>"; puedo alterar el contenido del <span id="loading"> y cambiarlo
por la imagen , y de igual forma al momento
de terminar la obtención de los resultados borro lo que hay dentro de B(<span id="loading">) y en A (<div id="resultados">)
cargo los resultados: A.innerHTML = ajax.responseText;
if(ajax.readyState==1){
B.innerHTML = "<img src='images/loading.gif' alg='Loading...'>";
}
if(ajax.readyState==4){
A.innerHTML = ajax.responseText;
B.innerHTML = "";
}
}
Espero que este tutorial, les hay servidor de algo y valga la pena la desveladota que me aventé... mañana mi examen de Ecuaciones Diferenciales y no estudié nada por estar escribiendo esto =S
Y bueno, ya para terminar: cualquier comentario o sugerencia que permita reforzar o documentar un poco mas este tutorial, es bien recibido 
...
Igual y si notan muchas inconsistencias en mi explicación o horrores ortográficos pues me echan un grito en los comentarios /puf que yo ya me voy a dormir! u_U
38 Comments
Make A CommentComments RSS Feed TrackBack URL
October 17th, 2007 at 3:13 am
[...] actualizada tan pronto tenga el tutorial y la CSStilación de Stan en mis manos Mejor escribí otro post, para que aparescan los cambios en el [...]
October 17th, 2007 at 10:55 am
Eres un Crack!
October 17th, 2007 at 12:25 pm
El titulo en ingles quedaria mejor como How to Create an Ajax Live Search o algo similar
October 17th, 2007 at 3:49 pm
@Stan:
@pecesama: Si, me gusta mas y ya lo cambié en el url gracias, gracias jeje
October 17th, 2007 at 6:03 pm
Te equivocaste, no son 1 y 2 los eventos sino 1 y 4 (el error es nadamas en la redacción, el código si está bien)
October 18th, 2007 at 7:09 am
Gracias JL, ya hice el cambio
@Stanmx: No te hagas... Que estamos anciosos esperando la CSSstilización del buscador
October 21st, 2007 at 3:05 am
[...] Mis Algoritmos Hi
123456 « Como hacer un Buscador con Ajax [...]
November 1st, 2007 at 5:46 pm
mil algoritmos como harias un buscador youporn con ajax aver si hace un tuto y calro la descarga ah por cierto este buscador no le vanta tengo problemas con el config.php aver si me explicas si chaufas
November 3rd, 2007 at 10:21 am
En la parte de la paginacion me direcciona a index.php pero este archivo no lo tengo, me podrias ayudar diciendome que lleva este archivo?
November 3rd, 2007 at 4:03 pm
@CHICOGREENDAY: :S
@Revilo: Fue un error mio, hay que cambiar index.php por buscador.php en donde está la línea que configura la paginación: Deberá ser algo así $p->target('buscador.php') (En los archivos busqueda.php y buscador.php casi al final de ámbos archivos). Si esto no soluciona el problema lo veo mas tarde por que estoy fuera de la ciudad y lejos de mi computadora personal.
November 6th, 2007 at 3:03 am
Jeje, lamento hacer pregunta de rubia, pero la parte del direccionamiento... no me anda!!! (son como las 5 de la madrugada, mola mogollon tu script, quise probarlo, pero... no anda! :S ) Intente lo de tu ultimo post, pero no se, creo q la fatiga me esta ganando!!!
November 6th, 2007 at 6:39 pm
ChicaRubia disculpa que no pueda atender esto en estos momentos, pero el fin de semana reviso con calma que está mal explicado o cual es el error.
November 7th, 2007 at 6:03 pm
Sorry Vic! Jaja, no hay problema, cuando puedas, es q soy ansiosa!
(cuando algo me gusta, voy y lo consigo, jajajaj!) Pero no t hagas problema, te re entiendo, xq yo tb estoy llena de trabajo! :S Creeme, si tuviera algo de time para betatestearlo en profundidad, lo haria! Hagamos un trato: si puedo, trato de meter mano al codigo y colaborar algo, xq en verdad esta MUY bueno este script!!! 
(y sino... pues vere de colaborar en otro script; la verdad es q no conocia tu blog, pero me volvere asidua visitante, xq esta interesante!!!)
November 29th, 2007 at 3:11 pm
Hola Victor
Me está gustando tu codigo, quiero utilizarlo pero me encuentro con algunas dudas. Estoy haciendo funcionar solo buscador.php y parace que todo va Ok, parece que no necesita a busqueda.php. Solo me da un error pero no creo que se deba a haber anulado busqueda.php
Cuando tecleo una letra que no está en lo buscado me devuelve en el DIV resultado el tipico OBJETO NO ENCONTRADO, sin embargo no hay problemas mientras vas tecleando letras que si que estan, es decir que si que arrojan resultados.
La otra duda es ¿para que el boton del submit, si no es necesario pulsarlo? ¿sería posible usarlo para enviar la consulta a otra pagina?
Esta ultima pregunta es porque sería muy util buscar en una base de datos y cuando ya tengas el resultado que buscas (por ejemplo se te haya quedado en 5 o 6 registros que coinciden con tu busqueda, le mandas a otro php la query que arroja esos 5 resultados para que haga algo con ellos, como por ejemplo pintarlos en un google map (que es mi intención), si te interesa hablamos del tema....
Saludos
November 29th, 2007 at 3:36 pm
Hola Intergus
buscador.php es la base de esta aplicación. El muestra resultados si le envías la variable ?q= en la barra de direcciones, pero si en vez de enviar la variable, escribes en la caja de texto, esta manda llamar a busqueda.php con la variable ?q= algo así busqueda.php?q=. Así, busqueda.php trae los resultados tal cual lo haría buscador.php, pero sin volver a mostrar la caja de búsqueda y el botón enviar. Son indispensables, ámbos archivos.
No entendí muy bien eso...
El botón "submit" podría ocultarse con CSS, y aunque no sirva de mucho si tenémos javascript activado, este debería funcionar cuando "javascript no está activado"
Puedes comentar lo que gustes. Cuéntame más acerca de lo que quieres hacer con google map. Podría ocurrírseme algo.
November 29th, 2007 at 4:48 pm
Pues no entiendo entonces muy bien como va.... lo estudiaré un poco más.
Lo que quiero hacer es permitir que busquen todos aquellos registros que cumplan la condicion de tener en un determinado campo, la palabra que el usuario busca, cuando al usuario ya le parece buena la busqueda, enviar esa busqueda a otro php que hará esa consulta y meterá los resultados (que serán los mismos que arrojó el buscador), los meterá como marcadores en el google map. Esa parte ya la tengo funcionando, es decir puedo hacer una consulta "select * from tabla where campo like $q" y lo que arroja, lo estoy metiendo en el mapa, ya que los registros disponen de coordenadas entre otras cosas.
Pero no se como hacer para lanzar la consulta. Por eso te comentaba si se podia usar el boton del form para lanzar esa consulta a un index con la query oculta para que no aparezca en el navegador.....
No se, ¿cómo lo ves?
November 29th, 2007 at 5:13 pm
La paginación da error. Al principio sale bien pero al no mostrar los resultados de la base de datos pero si los cuenta, saca paginación (2 páginas) pero no se ven resultados pues aun no se ha tecleado nada en la caja del buscador. Pues en ese momento si se pasa de pagina, salta error de OBJETO NO ENCONTRADO
November 29th, 2007 at 5:16 pm
vale.... solucionado cambiando en busqueda.php y buscador.php, aquello de ....
$p->target("index.php............
por
$p->target("buscador.php..........
son 2 lineas en cada fichero.
December 1st, 2007 at 2:40 pm
Hola Victor
En un intento de mejora, he modificado este trozo de codigo en ambos php (buscador y busqueda)
$q = sql_quote($_GET['q']); //para ejecutar consulta
$busqueda = htmlentities($q); //para mostrar en pantalla
if ($q''){
//CUENTA EL NUMERO DE PALABRAS
$trozos=explode(" ",$q);
$numero=count($trozos);
if ($numero==1) {
//SI SOLO HAY UNA PALABRA DE BUSQUEDA SE ESTABLECE UNA INSTRUCION CON LIKE
$sqlStr = "SELECT * FROM empresas WHERE pal_busca LIKE '%$q%'";
$sqlStrAux = "SELECT count(*) as total FROM empresas WHERE pal_busca LIKE '%$q%'";
} elseif ($numero>1) {
//SI HAY UNA FRASE SE UTILIZA EL ALGORTIMO DE BUSQUEDA AVANZADO DE MATCH AGAINST
//busqueda de frases con mas de una palabra y un algoritmo especializado
$sqlStr = "SELECT *, MATCH ( descripcion, pal_busca ) AGAINST ( '$q' ) AS Score FROM empresas WHERE MATCH ( descripcion, pal_busca ) AGAINST ( '$q' ) ORDER BY Score DESC";
$sqlStrAux = "SELECT count(*) as total FROM empresas WHERE MATCH ( descripcion, pal_busca ) AGAINST ( '$q' )";
}
}
}else{
$sqlStr = "SELECT * FROM empresas WHERE pal_busca LIKE ''";
$sqlStrAux = "SELECT count(*) as total FROM empresas WHERE pal_busca LIKE ''";
}
Con ello pretendo hacer una busqueda más completa para cuando pongan mas de una palabra en la caja de busqueda, pues si en el campo hay por ejemplo "pan pasteles tartas" y en la caja de busqueda pones pan tartas ya no encontraría nada y con este otro tipo de busqueda si que lo haria, pero me da un error, relativo al mysql_assoc y es por el valor de $sqlStrAux que no le debe de llegar....
¿se te ocurre algo?
Gracias
December 1st, 2007 at 3:10 pm
Si Intergus, esa sería una mejora en la consulta que realiza la búsqueda. No está de mas mencionar que este paso requiere crear un índice de texto completo en la tabla con la que trabajaremos referenciando a los campos con los que se realizará la búsqueda (Esta es para @Stan que está aprendiendo de estas cosas y trabajando con la CSStilización del buscador
)
Este paso podemos verlo en la documentación de MySQL con mucho detalle: "12.7. Funciones de búsqueda de texto completo (Full-Text)".
Bueno, continuando con el problema:
Creo que en las últimas dos consultas SQL te equivocaste. Yo no pondría la búsqueda con espacios en blanco:...}else{
$sqlStr = "SELECT * FROM empresas WHERE pal_busca LIKE ''";
$sqlStrAux = "SELECT count(*) as total FROM empresas WHERE pal_busca LIKE ''";
}
Yo lo haría así:
...}else{
$sqlStr = "SELECT * FROM empresas";
$sqlStrAux = "SELECT count(*) as total FROM empresas";
}
También veo otro errorsito, o algo que no entiendo por que lo haz hecho así:
if ($q''){//CUENTA EL NUMERO DE PALABRAS
uff, espera, vi varios errores o cosas extrañas, así que mejor pongo como lo haría yo:
$q = sql_quote($_GET['q']); //para ejecutar consulta
$busqueda = htmlentities($q); //para mostrar en pantalla
if(strpos(trim($q),' ')){
/*
* Si encuentra un espacio, entonces tenemos 2 o mas palabras, por lo que podemos utilizar MATCH(campos) AGAINST(búsqueda).
* Siempre y cuando exista un índice de texto completo (FULLTEXT) en la tabla relacionado a los campos que se pretende realizar la búsqueda.
*/
$sqlStr = "SELECT *, MATCH ( descripcion, pal_busca ) AGAINST ( '$q' ) AS Score FROM empresas WHERE MATCH ( descripcion, pal_busca ) AGAINST ( '$q' ) ORDER BY Score DESC";
$sqlStrAux = "SELECT count(*) as total FROM empresas WHERE MATCH ( descripcion, pal_busca ) AGAINST ( '$q' )";
}else{
/*
* Si no encuentra ningun espacio, entonces tenemos nada mas una palabra, por lo que utilizamos LIKE en la consulta SQL.
*/
$sqlStr = "SELECT * FROM empresas WHERE pal_busca LIKE '%$q%'";
$sqlStrAux = "SELECT count(*) as total FROM empresas WHERE pal_busca LIKE '%$q%'";
}
}else{
$sqlStr = "SELECT * FROM empresas";
$sqlStrAux = "SELECT count(*) as total FROM empresas";
}
uff, por último, no entiendo por que te muestra un error en cuanto al mysql_assoc. Tal vez tenga que ver con la tabla que usas, algún campo mal escrito o el índice de texto completo. Revísale bien
December 1st, 2007 at 3:15 pm
Bueno, ahora no da error, faltaba poner como fulltext en la base de datos los 2 campos descripcion y pal_busca, pero ahora mientras tecleas la primera palabra va de lujo pero al teclear el espacio en blanco para continuar, ya no encuentra nada y aunque sigas tecleando ya no encuentra nada pero no da errores, simplemente dice que no coincide ningun registro.
...... sigo probando.....
December 3rd, 2007 at 11:39 am
Nada, no funciona bien y tiene que ser por poca cosa. No me gustaria tirar la toalla pues me ha gustado el codigo pero sin el match again funcionando, vale de poco ....
Victor, ¿no te animas?.... supongo que estarás hasta arriba pero a lo mejor es cosa de poco.
December 3rd, 2007 at 3:03 pm
Por cierto, no encuentra nada con ñ, en cuanto la tecleas... se acabó.
December 26th, 2007 at 1:57 pm
Una duda... es posible en vez de hacer que pase las búsquedas (al dar clic en las diferentes páginas) por la URL que las pase por $_POST y así no cambié la URL???
:$
January 10th, 2008 at 11:40 am
gracias me fue de mucha ayuda, lo adapte a mis necesidades, pero super facil de usar, no me demore nada
muchas gracias la verdad
January 11th, 2008 at 1:47 am
@Intergus, debes de tener cuidado con el juego de caracteres. Tal vez si tomas en cuenta utf8_encode y utf8_decode puedas lograr lo que no funciona, de otra manera no podría ayudarte.
@Abraham, creo que es posible, tendrás que hacer alguna función que haga exáctamente lo mismo que hago al dar clic en el botón submit.
@link, me alegra mucho saberlo ¡Suerte con eso!
¡Feliz año a todos! Ya estoy de vuelta por aquí ... uff, casi desde noviembre desaparecido.
February 14th, 2008 at 12:25 am
Cual es la base de datos?
February 14th, 2008 at 1:57 am
La que pienses usar.
February 19th, 2008 at 2:52 am
y si quiero poner más de un criterio de búsqueda, es decir, hacer un buscador avanzado, donde poder seleccionar los campos por los que buscar y si hay dos campos a buscar me los busque?
February 19th, 2008 at 10:15 am
Sólo agrega los inputs que necesites y algún momento (apoyandote de los eventos) realizas la búsqueda.
Para cualquier otro caso, sólo es cuestion de agregar los <input> que necesites y tener en cuenta que cada uno tiene eventos especiales con los cuales podrías tu determinar "en este momento realiza la búsqueda".
Para buscas en dos campos, pues modificas la consulta en base a lo que envíes mediante los _POST.
Creo que es momento de dejar en claro: Para coomprender este documento, es necesario tener cierto dominio (al menos conocimiento básico) del funcionamiento de los formularios, y entender perfectamente que es el envío de datos por _GET, _POST u otro método. http://www.w3schools.com/html/html_forms.asp
February 25th, 2008 at 1:45 pm
AYUDA!!!!!!!
A mi no me funciona porque no tengo los campos nesesarios ;(!!!!!!!!!!!1
Dijiste todo menos la tabla y campo de mysql!!!!
Decime dejando un comentario en mi web...http://mrb.laweb.es o por msn, marcelo11_Cho@hotmail.com
Porfa!!!!
March 4th, 2008 at 12:56 am
Un saludo cordial a todos y gracias a ti Victor.
quisiera que pulbicases tambien el script d ela BD.
March 5th, 2008 at 7:30 am
El script va perfectamente, pero hay un problema bastante grande, que la paginación no es ajax. Es decir, la busqueda la hace sin hacer la renovación de la página, pero la paginación necesita refrescarla.
Hay alguna forma para que la paginación también sea utilizando ajax?
March 8th, 2008 at 12:18 am
Como hago paraque al aparecer los links despues de la busqueda, al darle click, por ejemplo me lleve a otra pagina que tengo alojado en mi localhost
March 8th, 2008 at 12:22 am
Quizas no me explique bien:
Yo en mi buscador tecleo "algorit" y me muestra el contenido que teno en una tabla de mi BD, ahora quisiera saber como al darle click en un link que yo elijo me lleva a otra pagina donde muestro el contenido completo de lo que yo seleccione.
March 8th, 2008 at 2:05 pm
y si por ejemplo quiero hacer uina busqueda, en la cual yo le envien el nombre del campo donde va a buscar?? los nombres de los campos se pueden manaejar con un combo
April 18th, 2008 at 8:27 am
siii, el gran problema de ajax es la letra ñ y Ñ y los acentos, yo tambien hice un buscador pero cuando metia palabras con ñ o Ñ no las encontraba, osea, las encotraba si tecleaba todo en minusculas pero si lo hacia con mayusculas no lo encontraba y es debido a q la ñ y Ñ se codifican de distinto modos y usando la funcion utf8_encode no lo solucionaba, tampoco pasando todo a mayuscula o minuscula con strtoupper y strtolower
todavia sigo buscando como corregir eso si alguien tiene alguna sugerencia
April 19th, 2008 at 12:50 am
Hola a todos! disculpen que no haya podido contestarles antes, El sitio estado siendo atacado con DDoS por algún listillo y también he tenido bastantes pendientes.
Para los que **creen** necesitar el script de la base de datos: NO se necesita un script? úsenlo con la base de datos que ustedes quieran, lo único indispensable para tenerla funcionando es que contenga registros, y si de plano no les sale,? tómenlo como reto,
Y si, el problema con este tipo de aplicaciones para los que utilizamos la eñe y los acentos es el uso de los caracteres extraños dado que internamente estas aplicaciones DEBEN casi por regla
jeje utilizar UTF-8, disculpen que se me haya olvidado mencionar esto: Realmente no tengo un listado de que mejoras podría hacer para un 2do artículo para mejorar este buscador tan fofo.
Uff, no se por qué no apliqué la paginación en AJAX, pero trataré algún día no muy lejano de implementarlo, y tal vez compartirlo con ustedes
@Alex Ludvin: Disculpa que no te haya contestado antes, no me ha sido posible atender el sitio desde hace ya tiempo... Lo que tratas de decir es que quieres que prácticamente esto funcione como si estuviéramos creando un mini blog?