Foros del Web » Programando para Internet » Jquery »

[SOLUCIONADO] Autocomplete con Ajax

Estas en el tema de Autocomplete con Ajax en el foro de Jquery en Foros del Web. Buenos Días: Tengo un HTML con el siguiente INPUT de un Nombre: @import url("http://static.forosdelweb.com/clientscript/vbulletin_css/geshi.css"); Código HTML: Ver original < div class = "form-group" >   ...
  #1 (permalink)  
Antiguo 12/04/2018, 07:05
Usuario no validado
 
Fecha de Ingreso: abril-2009
Ubicación: Buenos Aires
Mensajes: 413
Antigüedad: 14 años, 11 meses
Puntos: 3
Autocomplete con Ajax

Buenos Días:

Tengo un HTML con el siguiente INPUT de un Nombre:
Código HTML:
Ver original
  1. <div class="form-group">
  2.     <label>Ingrese Nombre Referencia</label>
  3.     <input type="text" class="form-control" id="nomref" name="nomref" placeholder="Referencia" value="<?php echo (isset($dato['nomref']) ? $dato['nomref'] : '') ?>"/>     
  4.     <div id="suggestions_ref"></div>
  5. </div>

El JQuery:
Código Javascript:
Ver original
  1. $(document).ready(function () {
  2.     //Al escribr dentro del input con id="nomref"
  3.     $('#nomref').keypress(function () {
  4.         //Obtenemos el value del input
  5.         var nomref = $(this).val();
  6.         var dataString = 'nomref=' + nomref;
  7.  
  8.         //Le pasamos el valor del input al ajax
  9.         $.ajax({
  10.             type: "POST",
  11.             url: "index.php?ctl=autocompleta_referencias",
  12.             data: dataString,
  13.             success: function (data) {
  14.                 //Escribimos las sugerencias que nos manda la consulta
  15.                 $('#suggestions_ref').fadeIn(100).html(data);
  16.  
  17.                 //Al hacer click en algua de las sugerencias
  18.                 $('.suggest_ref-element a').live('click', function(){
  19.                     $('.suggest_ref-element a').click(function () {
  20.                         //Obtenemos la id unica de la sugerencia pulsada
  21.                         var id = $(this).attr('id');
  22.                         var infref = $(this).attr('infref');
  23.                        
  24.                         //Editamos el valor del input con data de la sugerencia pulsada
  25.                         $('#nomref').val($('#' + id).attr('data'));
  26.                         $('#idreferencia').val($('#' + id).attr('id'));
  27.                         $('#infref').val($('#' + id).attr('infref'));
  28.                        
  29.                         //Hacemos desaparecer el resto de sugerencias
  30.                         $('#suggestions_ref').fadeOut(100);
  31.                     });
  32.                 });
  33.             }
  34.         });
  35.     });
  36. });

El controlador:
Código PHP:
Ver original
  1. <?php
  2. public function autocompleta_referencias() {
  3.     $controlador_principal = new Controlador();
  4.     $controlador_principal->Incluir('Modelo_Referencias');
  5.     $busco = $_POST['nomref'];
  6.  
  7.     if ((strlen(trim($busco))) >= 3) {
  8.         $modelo = new Modelo_Referencias();
  9.        
  10.         if (is_numeric($busco)) {
  11.             $sql = "select ref.idreferencia id,rec.nombre nombre, concat('(umc:',umc.nombre,' ',tem.nombre,' ',rec.idseccion,'/',rec.numero,' art:',ref.articulo_proveedor,')') infref from referencias ref join referencias_cabeceras rec on rec.idreferencia_cabecera=ref.idreferencia_cabecera join unidadesmedida umc on ref.idunidadmedida_compra=umc.idunidadmedida join temporadas tem on rec.idtemporada=tem.idtemporada where rec.numero=" . substr($busco, 2, 5) . " and rec.idseccion=" . substr($busco, 0, 2) . " ORDER BY rec.nombre DESC limit 50";
  12.         } else {
  13.             $sql = "select ref.idreferencia id,rec.nombre nombre, concat('(umc:',umc.nombre,' ',tem.nombre,' ',rec.idseccion,'/',rec.numero,' art:',ref.articulo_proveedor,')') infref from referencias ref join referencias_cabeceras rec on rec.idreferencia_cabecera=ref.idreferencia_cabecera join unidadesmedida umc on ref.idunidadmedida_compra=umc.idunidadmedida join temporadas tem on rec.idtemporada=tem.idtemporada where rec.nombre like '" . $busco . "%' ORDER BY rec.nombre DESC limit 50";
  14.         }
  15.            
  16.         $params = array('seleccion' => $modelo->ejecutar($sql));
  17.  
  18.         foreach ($params['seleccion'] as $row) {
  19. ?>
  20.             <div class="suggest_ref-element">
  21.                 <a data="<?php echo utf8_encode(trim($row['nombre'])); ?>"  id="<?php echo $row['id']; ?>"  infref="<?php echo utf8_encode(trim($row['infref'])); ?>"  </a>
  22.                 <?php echo $row['nombre'] . ' ' . $row['infref']; ?>
  23.             </div>
  24. <?php
  25.         }
  26.     }
  27. }

El problema es que al controlador siempre llega un caracter menos, ejemplo si escribo "PANTALON" llega "PANTALO" y al borrar el campo hacia atras no ejecuta el controlador.

Muchas Gracias a quien pueda ayudarnos.

Última edición por Alexis88; 12/04/2018 a las 10:07 Razón: Highlight
  #2 (permalink)  
Antiguo 12/04/2018, 08:49
Avatar de ArturoGallegos
Moderador
 
Fecha de Ingreso: febrero-2008
Ubicación: Morelia, México
Mensajes: 6.774
Antigüedad: 16 años, 1 mes
Puntos: 1146
Respuesta: Autocomplete con Ajax

El problema lo tienes aquí
Código Javascript:
Ver original
  1. $('#nomref').keypress(function () {})

En keypress aun no es capturado el carácter hasta que sueltas la tecla, intenta con keyup
  #3 (permalink)  
Antiguo 13/04/2018, 15:05
Usuario no validado
 
Fecha de Ingreso: abril-2009
Ubicación: Buenos Aires
Mensajes: 413
Antigüedad: 14 años, 11 meses
Puntos: 3
Respuesta: Autocomplete con Ajax

Muchas Gracias Amigo, FUNCIONO!!!!

Etiquetas: ajax
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 10:12.