De antemano digo que estoy empezando en el mundo de la programacion web, en esta ocasion quisiera hacer el efecto de autocompletado con bootstrap-typeahead.js
asi es como tengo mi html:
Código HTML:
Ver original <title>Twitter Bootstrap Typeahead Extension Demo
</title>
<link href="css/bootstrap.css" rel="stylesheet"> <link href="css/demo.css" rel="stylesheet"> <script src="js/mockjax.js" type="text/javascript"></script> <script src="js/bootstrap-typeahead.js" type="text/javascript"></script>
<div class="alert alert-block alert-success"> <input id="demo1" type="text" class="span4" placeholder="Search cities..." autocomplete="off" />
un formulario con un solo input para hacer una especie de prueba.
asi tengo el archivo demo.js:
Código Javascript
:
Ver original$(function () {
$('#typeahead').typeahead({
source: function (query, process) {
$.ajax({
url:'counties.php',
type:'POST',
data:'query=' + query,
dataType:'JSON',
async:'true',
success: function (data) {
process(data);
}
});
}
});
});
y asi tengo el archivo php:
Código PHP:
<?php
if(isset($_POST('query'))){
//conectando a la base de datos
$conectar=mysql_connect("localhost", "root", "");
mysql_select_db("odontologia");
if($conectar){
mysql_select_db("odontologia",$conexion);
echo "conexion exitosa";
}
//query
$query= $_POST['query'];
//consulta a la db
$sql=mysql_query("SELECT * from usuarios WHERE nombre LIKE '%{$query}%'");
$array= array();
while ($row = mysql_fetch_assoc($sql)) {
$array[] = $row('nombre');
//return the array
echo json_encode($array);
}
}
?>
Pense que todo estaba en orden pero no funciona.
si cambio el archivo demo.js y pongo esto:
Código Javascript
:
Ver original$(function () {
$('#demo1').typeahead({
source: [
{ id: 1, name: 'Toronto' },
{ id: 2, name: 'Montreal' },
{ id: 3, name: 'New York' },
{ id: 4, name: 'Buffalo' },
{ id: 5, name: 'Boston' },
{ id: 6, name: 'Columbus' },
{ id: 7, name: 'Dallas' },
{ id: 8, name: 'Vancouver' },
{ id: 9, name: 'Seattle' },
{ id: 10, name: 'Los Angeles' }
],
itemSelected: displayResult
});
enseguida funciona, me imagino que el error esta en la llamada al archivo php pero no encuentro el problema, de antemano gracias por los comentarios.