Buscador en tiempo real con ajax y php a base de datos
Hoy vamos a hacer un buscador en tiempo real con ajax y php consultando una base de datos y mostrando los resultados debajo del buscador de una manera muy sencilla.
Vamos con el ejemplo, este es el script que hemos llamado ejemplo.php que envía con ajax lo que escribimos en el campo de búsqueda a un fichero php que hemos llamado buscar.php:
Cualquier duda comentar ;)
Editado
Vamos con el ejemplo, este es el script que hemos llamado ejemplo.php que envía con ajax lo que escribimos en el campo de búsqueda a un fichero php que hemos llamado buscar.php:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> <script> function buscar_ajax(cadena){ $.ajax({ type: 'POST', url: 'buscar.php', data: 'cadena=' + cadena, success: function(respuesta) { //Copiamos el resultado en #mostrar $('#mostrar').html(respuesta); } }); } </script> <form> <input type="text" name="bucar" onkeyup="buscar_ajax(this.value);"> </form> <div id="mostrar"></div>Ahora recogemos el valor enviado en el fichero buscar.php:
<?php //Recogemos la cadena $busqueda=$_POST['cadena']; //Aquí hacer la consulta para la busqueda con LIKE $busqueda $query = sprintf("SELECT * FROM tabla WHERE columna LIKE %s", GetSQLValueString("%" . $busqueda . "%", "text")); //Función GetSQLValueString al fina del tema //Esto se pega en la div #mostrar echo 'Demo '.$busqueda; //Mostrar los resultados aquí ?>Aquí la función GetSQLValueString necesaria para que funcione la consulta https://datoweb.com/post/2496/formatear-valor-de-cadena-para-sql-con-php
Cualquier duda comentar ;)
Editado
1
Puntos
Puntos
29660
Visitas
Visitas
8
Resp
Resp
Por alber hace 103 meses
Administrador
Respuesta #1
Interesante, siempre me pregunté como se hacía más nunca busqué (yo, el más flojo). Y no se me había ocurrido, la magia de "tiempo real" está ahí en el evento onkeyup jajajaj.
________________________________________________________________________________________
Para los que piensan copiar y pegar el código, quiero acotar lo siguiente:
En el post anexado que habla sobre formatear el valor de la cadena para SQL con PHP, la función tiene como nombre valor_cadena() mientras que en el ejemplo mostrado en éste post tiene como nombre GetSQLValueString(). Deben ajustar uno de los dos nombres para que funcione correctamente. Lo que pasa es que GetSQLValueString es el nombre que usa el software Dreamweaver, mientras que valor_cadena es un nombre cualquiera que le puso el colega alber en plan genérico.
________________________________________________________________________________________
Para los que piensan copiar y pegar el código, quiero acotar lo siguiente:
En el post anexado que habla sobre formatear el valor de la cadena para SQL con PHP, la función tiene como nombre valor_cadena() mientras que en el ejemplo mostrado en éste post tiene como nombre GetSQLValueString(). Deben ajustar uno de los dos nombres para que funcione correctamente. Lo que pasa es que GetSQLValueString es el nombre que usa el software Dreamweaver, mientras que valor_cadena es un nombre cualquiera que le puso el colega alber en plan genérico.
Respuesta #2
Vale, probando el codigo, tal cual esta, lo uncio que me muestra debajo del input es Demo "texto que ponga", pero no me muestra resultados de SQL. Algo estoy haciendo mal?
Respuesta #3
Zapikero te muestra eso por que es una demo, para que muestre los resultados tienes que hacer la consulta a la base de datos:
Si nunca has hecho un buscador interno te paso un enlace a unos de los cursos premium que tenemos http://cursos.datoweb.com/curso-web-anuncios
//Aquí hacer la consulta para la busqueda con LIKE $busqueda $query = sprintf("SELECT * FROM tabla WHERE columna LIKE %s", GetSQLValueString("%" . $busqueda . "%", "text")); //Función GetSQLValueString al fina del temaAquí la función GetSQLValueString necesaria para que funcione la consulta https://datoweb.com/post/2496/formatear-valor-de-cadena-para-sql-con-php
Si nunca has hecho un buscador interno te paso un enlace a unos de los cursos premium que tenemos http://cursos.datoweb.com/curso-web-anuncios
0
Puntos
Puntos
Por alber hace 103 meses
Administrador
Respuesta #4
claro, ya esta echa, pero me sale eso...
Respuesta #5
Buenas,
Me está dando un error en la variable:
Me está dando un error en la variable:
$busqueda=$POST['cadena'];
0
Puntos
Puntos
Por valentinchiflu hace 103 meses
Principiante
Respuesta #6
Recuerda que la variable reservada de PHP es $_POST, con un guión bajo.
$busqueda=$_POST['cadena'];
Respuesta #7
Cierto tenías razon, nose como se me paso eso, el problema que me da ahora es que en la div donde va el codigo:
Aunque con el Demo tampoco me sale.
O tengo que poner alguna informacion de la base de datos en vez de Demo??
Salu2
<?php //Esto se pega en la div #mostrar echo 'Demo '.$busqueda; //Mostrar los resultados aquí ?>Me dice que la variable $busqueda no existe, sera porque le he quitado el Demo??
Aunque con el Demo tampoco me sale.
O tengo que poner alguna informacion de la base de datos en vez de Demo??
Salu2
0
Puntos
Puntos
Por valentinchiflu hace 103 meses
Principiante
Respuesta #8
Veo que hay dos temas paralelos acerca de ésto.
El problema aquí es que, bien haces el $query pero no lo ejecutas. Es decir Te falta realizar la consulta php
El problema aquí es que, bien haces el $query pero no lo ejecutas. Es decir Te falta realizar la consulta php
$consulta = mysql_query($query);Y luego obtener los resultados
$resultados = mysql_fetch_array($consulta);Luego de tener los resultados es que muestras lo que quieres mostrar.
echo "Demo " . $esultados["columna"]; // Siendo ["columna"] una de las columnas de la base de datos. Ej: idTienes un ejemplo completo en el otro post