0

Bueno estoy usando Bootstrap TypoeHead y tengo lo siguiente:

  $('input.typeahead').typeahead({
    source: function (query, process) {
    var busqueda= $('input#nomcli').val();
      return $.get('/views/modules/facta/procesocliente.php', { query: busqueda }, function 
     (data) {
     data = $.parseJSON(data);

     return process(data);
     });
     },
     showHintOnFocus:'all'
    });

En mi archivo php tengo:

<?php

include_once ($_SERVER['DOCUMENT_ROOT'].'/includes/claseConexion.php');
    try
    {
        $conexion = Conexion::singleton_conexion();
        

        $stm=$conexion->prepare("SELECT * FROM cliente WHERE cliente.nombre like 
 '%".$_GET['busqueda']."%';");
          $stm->execute();
  
       if ($array){
        echo json_encode($array);
     }
     else{
        echo json_encode('no hubo coincidencias');
     }
              
    }
    catch(Exception $e)
    {
        die($e->getMessage());
    }
?>

Pero me devuelve siempre "No hubo coincidencias", y lo muestra letra por letra de arriba hacia abajo.

Aqui el html:

 <div class="input-group"> <label class="titulo" >Nombre Cliente</label>
  <span class="input-group-text amber lighten-3" type="button" id="buscarcliente" data- 
toggle="modal" data-target="#myModalAC"><i class="fas fa-search text-grey" aria- 
hidden="true"> 
</i>
  </span><input class="typeahead form-control" type="text" placeholder="Ingrese Nombre" 
 class="form-control my-0 py-1 amber-border" autocomplete="on" type="text" id="nomcli" 
aria-label="Search" />

 </div>

Bueno al final me di cuenta que le estaba pasando "busqueda" a mi php y es "query".

al final tengo:

   <?php

   include_once ($_SERVER['DOCUMENT_ROOT'].'/includes/claseConexion.php');
    try
    {
        $conexion = Conexion::singleton_conexion();


        $consulta="SELECT * FROM cliente WHERE cliente.nombre like 
  '%".$_GET['query']."%';";
$array=$conexion->query($consulta);

       if ($array){
       
        echo json_encode($array);
     }
     else{
        echo json_encode('no hubo coincidencias');
     }
              
    }
    catch(Exception $e)
    {
        die($e->getMessage());
    }
 ?>

Pero no logro devolver el array al input, es decir no me toma el json: Obtengo lo siguiente:

VM2007:1 Uncaught SyntaxError: Unexpected token A in JSON at position 0 at Function.parse [as parseJSON] () at Object.success (factura.js:102) at fire (jquery-3.4.1.js:3291) at Object.fireWith [as resolveWith] (jquery-3.4.1.js:3421) at done (jquery-3.4.1.js:9533) at XMLHttpRequest. (jquery-3.4.1.js:9785)

Quiere decir que estoy devolviendo mal el conjunto de datos, cual seria la manera?

Acabo de probar otro metodo con Jquery:

$('input.typeahead').typeahead({

 items: 4,
    source: function(request, response) {
        $.ajax({
            url: "/views/modules/facta/procesocliente.php",
         dataType:'json',
            data: {
                state: $("input#nomcli").val(),
                term: request.term
            },
            success: function (data) {
              console.log(data);
                response(data);
            }
        });
    },
    autoSelect: true,
    displayText: function (item) {
        return item.value;
 
}


});

Los datos llegan filtrados en console.log(data). Pero obtengo:

introducir la descripción de la imagen aquí

si se fijan al ir clickeando va filtrando pero tengo el error de la imagen.

2
  • 1
    Significa que no estás devolviendo un JSON válido, quizá porque ha habido una excepción o porque no se está ejecutando correctamente tu código el 13 nov. 2020 a las 12:13
  • Si me fijo en Network en la consola, con cada letra tipeada filtra bien los resultados y aparecen cada vez menos. quizas el formato JSON esta mal.
    – Caruso
    el 13 nov. 2020 a las 12:21

3 respuestas 3

0

Desde PHP siempre debes devolver un JSON válido:

<?php
include_once ($_SERVER['DOCUMENT_ROOT'].'/includes/claseConexion.php');
try
{
    $conexion = Conexion::singleton_conexion();
    $consulta="SELECT * FROM cliente WHERE cliente.nombre like
       '%".$_GET['query']."%';";
    $array=$conexion->query($consulta);        
    if ($array){
        echo json_encode($array);
    }
    else{
        // Devolver mensaje como un elemento de arreglo
        echo json_encode(['no hubo coincidencias']);
    }
          
}
catch(Exception $e)
{
    // Devolver error como un elemento de arreglo, en JSON
    echo json_encode([$e->getMessage()]);
}

Ahora, otro problema que puede presentarse es la forma en que manipulas el arreglo recibido que, dependiendo de la estructura de tu tabla clientes, podría ser algo como:

[
    {id: 1, nombre: "Nombre cliente 1", direccion: "Dirección cliente 1"},
    {id: 2, nombre: "Nombre cliente 2", direccion: "Dirección cliente 2"},
    {id: X, nombre: "Nombre cliente X", direccion: "Dirección cliente X"}
]

Si aún sigues teniendo problemas, por favor edita la pregunta para agregar el código que usas para mostrar los resultados y los datos que estás obteniendo de la consulta que, por cierto, ese SELECT * FROM cliente está leyendo todos los campos de la tabla y no son necesarios, quizá solo necesites ID y nombre.

2
  • Tenes razon en la manera de devolver el JSON dado que necesito el id del cliente y el nombre. Pero como podria manipular ese array en Jquery?
    – Caruso
    el 15 nov. 2020 a las 12:29
  • Puedo valerme de AfterSelect, pero tendria que publicar otra pregunta para resolver otra cuestion.
    – Caruso
    el 15 nov. 2020 a las 18:26
0

Tu problema es que tu código de Typeahead espera un array siempre pero, cuando no hay resultados, en lugar de devolver un array vacío estás devolviendo el string 'no hubo coincidencias'.

1
  • Es que si hay coincidencias.. Por eso muestra el array en la consola. Al ir tipeando van disminuyendo los resultados. El Typehead espera un JSON
    – Caruso
    el 13 nov. 2020 a las 14:32
0

Bueno al final funciono de la siguiente manera:

 <?php
error_reporting(E_ALL);
ini_set('display_errors', '1');
include_once ($_SERVER['DOCUMENT_ROOT'].'/includes/claseConexion.php');

    try
    {
        $conexion = Conexion::singleton_conexion();
        $query ="SELECT * FROM cliente WHERE cliente.nombre like 
 '%".$_GET['busqueda']."%';";
         $result = $conexion->query($query);
         $output=array();
         if($result)
            {
             //armo un array con los resultados
             foreach($result as $row){
          
                  $output[] = $row["nombre"];
             
            }}
            else
            {
               $output[]='Cliente no encontrado';
            }
              echo json_encode($output);
}

    catch(Exception $e)
    {
        die($e->getMessage());
    }
?>

Tuve que cargar los resultados en filas en un array como veran. Luego en JQuery hice:

      $('#nomcli').typeahead(
    {
    maxLength: false,
    source: function (busqueda, resultado)
    {
      $.ajax({
           url: "/views/modules/facta/procesocliente.php",
                data: 'busqueda=' + $("#nomcli").val(),            
             dataType:'json',
                type: "GET",
        beforeSend: function()
        {
         $('#div_estado_busqueda_producto').html("buscando..");
        },
        success: function (data)
        {
          if(data=="cliente no encontrado")
          {
            $('#div_estado_busqueda_cliente').html("Cliente no existe");
            return;
          }
          resultado($.map(data, function (item)
          {
            $('#div_estado_busqueda_cliente').html("");
            return item;
          }));
        }
      });
    }
  }); 

Lo unico que me estaria faltando seria tomar el id del cliente para pasarlo al carrito de compra(asociarlo).

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.