Foros del Web » Programando para Internet » Javascript » Frameworks JS »

autocompletar con bootstrap-typeahead

Estas en el tema de autocompletar con bootstrap-typeahead en el foro de Frameworks JS en Foros del Web. 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 ...
  #1 (permalink)  
Antiguo 26/06/2013, 22:39
 
Fecha de Ingreso: junio-2012
Ubicación: colombia
Mensajes: 48
Antigüedad: 9 años, 4 meses
Puntos: 0
autocompletar con bootstrap-typeahead

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
  1.     <title>Twitter Bootstrap Typeahead Extension Demo</title>
  2.  
  3.     <link href="css/bootstrap.css" rel="stylesheet">
  4.     <link href="css/demo.css" rel="stylesheet">  
  5.     <script src="js/mockjax.js" type="text/javascript"></script>
  6.     <script src="js/bootstrap-typeahead.js" type="text/javascript"></script>
  7.     <script src="js/demo.js" type="text/javascript"></script>
  8. </head>
  9. <body class="container">
  10.  
  11.     <div class="alert alert-block alert-success">
  12.     </div>
  13.     <div class="row">
  14.         <div class="well span4">
  15.             <input id="demo1" type="text" class="span4" placeholder="Search cities..." autocomplete="off" />
  16.         </div>
  17.  
  18. </body>
un formulario con un solo input para hacer una especie de prueba.
asi tengo el archivo demo.js:
Código Javascript:
Ver original
  1. $(function () {
  2.   $('#typeahead').typeahead({
  3.     source: function (query, process) {
  4.         $.ajax({
  5.             url:'counties.php',
  6.             type:'POST',
  7.             data:'query=' + query,
  8.             dataType:'JSON',
  9.             async:'true',
  10.             success: function (data) {
  11.               process(data);
  12.             }
  13.         });
  14.       }
  15.   });
  16. });
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
  1. $(function () {
  2.  
  3.     $('#demo1').typeahead({
  4.         source: [
  5.             { id: 1, name: 'Toronto' },
  6.             { id: 2, name: 'Montreal' },
  7.             { id: 3, name: 'New York' },
  8.             { id: 4, name: 'Buffalo' },
  9.             { id: 5, name: 'Boston' },
  10.             { id: 6, name: 'Columbus' },
  11.             { id: 7, name: 'Dallas' },
  12.             { id: 8, name: 'Vancouver' },
  13.             { id: 9, name: 'Seattle' },
  14.             { id: 10, name: 'Los Angeles' }
  15.         ],
  16.         itemSelected: displayResult
  17.     });
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.
  #2 (permalink)  
Antiguo 27/06/2013, 13:23
 
Fecha de Ingreso: junio-2013
Mensajes: 14
Antigüedad: 8 años, 4 meses
Puntos: 0
Respuesta: autocompletar con bootstrap-typeahead

mira a decir verdad creo que de programacion se menos que tu pero yo tambien intento completar un campo mira lo e realizado para autocompletar un solo campo siguiendo este ejemplo, [URL="http://phpcoderzone.blogspot.mx/2012/11/auto-complete-text-box- with-php-jquery.html"]http://phpcoderzone.blogspot.mx/2012/11/auto-complete-text-box-[/URL]

pero en estos otros me apoye...

http://jqueryui.com/autocomplete/

http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/

http://www.larepaweb.com.ar/2013/05/busqueda-con-

autocompletar-usando-jquery-bassistance-php-y-mysql/

mmm bueno creo que tu me puedes ayudar a mi yo quiero que despues de que selecciones el primer input, se llene otro cuyo valor depende del primero y esta en la bd me ayudas

Etiquetas: ajax, formulario, funcion, html, input, javascript, js, php, select
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 22:35.