1

Estoy tratando de hacer una función de Js que autocomplete el campo de un formulario con base en un select de mi BD. Utilicé este método: https://www.baulphp.com/autocompletar-usando-php-mysql-y-jquery/ Si lo hago por separado, funciona, pero si lo integro a mi formulario ya hecho, me lo muestra antes de los encabezados. Agradeceré orientación

    <?php
//Funcion mostrar RFC
// Utilizaremos conexion PDO PHP
function conexion() {
//Declaramos el servidor, la BD, el usuario Mysql y Contraseña BD.
    return new PDO('mysql:host=localhost;dbname=sdc', 'root', '', array(PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION, PDO::MYSQL_ATTR_INIT_COMMAND => "SET NAMES utf8"));
}

$pdo = conexion();
$keyword = '%'.$_POST['palabra'].'%';
$sql = "SELECT DISTINCT(rfc) FROM operacion WHERE rfc LIKE (:keyword) ORDER BY rfc ASC ";
//$sql = "SELECT DISTINCT(rfc) FROM operacion WHERE rfc LIKE (:keyword) ORDER BY rfc ASC LIMIT 0, 7";
$query = $pdo->prepare($sql);
$query->bindParam(':keyword', $keyword, PDO::PARAM_STR);
$query->execute();
$lista = $query->fetchAll();
foreach ($lista as $milista) {
// Colocaremos negrita a los textos
$rfc = str_replace($_POST['palabra'], '<b>'.$_POST['palabra'].'</b>', $milista['rfc']);
// Aquì, agregaremos opciones
    echo '<li onclick="set_item(\''.str_replace("'", "\'", $milista['rfc']).'\')">'.$rfc.'</li>';
//Esto es lo que se muestra en el menu
}

?>

    <script type="text/javascript">
        // Función autocompletar para RFC
        function autocompletar() {
            var minimo_letras = 0; // minimo letras visibles en el autocompletar
            var palabra = $('#txtRfc').val();
            //Contamos el valor del input mediante una condicional
            if (palabra.length >= minimo_letras) {
                $.ajax({               
                type: 'POST',
                data: {palabra:palabra},
                success:function(data){
                    $('#lista_id').show();
                    $('#lista_id').html(data);
                    }
                });
            } else {
                //ocultamos la lista
                $('#lista_id').hide();
            }
        }

        // Funcion Mostrar valores
        function set_item(opciones) {
            // Cambiar el valor del formulario input
            $('#txtRfc').val(opciones);
            // ocultar lista de proposiciones
            $('#lista_id').hide();
        };</script>
3
  • 1
    Para poder ayudarte, es preciso que edites tu pregunta poniendo en ella el código con el que estás enfrentando el problema. No servirá de nada para una solución revisar el método que seguiste para programar, sino lo que has programado en sí. Gracias.
    – A. Cedano
    Commented el 10 ene. 2018 a las 18:55
  • Hola Angela_Gossow, te recomiendo que leas Cómo preguntar y cómo crear un ejemplo mínimo verificable y que edites la pregunta a partir de los consejos que encontrarás allí. Es imposible ayudarte a solucionar un problema de código sin ver el código.
    – Alvaro Montoro
    Commented el 10 ene. 2018 a las 19:07
  • Angela, el problema es la etiqueta de cierre del bloque PHP, la tienes al final de todo, cuando deberías ponerla antes del input ya que a partir de ahí empiezas un bloque de código HTML/Jasvascript. O sea, debería quedarte así: ?> <input autocomplete="off" name="txtRfc" id="txtRfc" type="text" class="form-control" onkeyup="this.value=this.value.toUpperCase();"onkeydown="autocompletar()"/> <script type="text/javascript"> //...resto del código Javascript </script> y la etiqueta de cierre que tienes al final del todo ?> debes quitarla, ya que cerraste más arriba el bloque PHP.
    – A. Cedano
    Commented el 10 ene. 2018 a las 19:57

1 respuesta 1

1

Angela, el problema es la etiqueta de cierre del bloque PHP, la tienes al final de todo, cuando deberías ponerla antes del input ya que a partir de ahí empiezas un bloque de código HTML/Jasvascript.

Y al final, no tienes que usarla, porque no se abre ningún otro bloque de PHP.

Debería quedar así:

<?php
//Funcion mostrar RFC
// Utilizaremos conexion PDO PHP
function conexion() {
    //Declaramos el servidor, la BD, el usuario Mysql y Contraseña BD.
    return new PDO('mysql:host=localhost;dbname=sdc', 'root', '', array(PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION, PDO::MYSQL_ATTR_INIT_COMMAND => "SET NAMES utf8"));
}

$pdo = conexion();
$keyword = '%'.$_POST['palabra'].'%';
$sql = "SELECT DISTINCT(rfc) FROM operacion WHERE rfc LIKE (:keyword) ORDER BY rfc ASC ";
//$sql = "SELECT DISTINCT(rfc) FROM operacion WHERE rfc LIKE (:keyword) ORDER BY rfc ASC LIMIT 0, 7";
$query = $pdo->prepare($sql);
$query->bindParam(':keyword', $keyword, PDO::PARAM_STR);
$query->execute();
$lista = $query->fetchAll();
foreach ($lista as $milista) {
    // Colocaremos negrita a los textos
    $rfc = str_replace($_POST['palabra'], '<b>'.$_POST['palabra'].'</b>', $milista['rfc']);
    // Aquì, agregaremos opciones
    echo '<li onclick="set_item(\''.str_replace("'", "\'", $milista['rfc']).'\')">'.$rfc.'</li>';
    //Esto es lo que se muestra en el menu
}
//A partir de aquí no hay más código PHP, así que cerramos el bloque PHP
?>

<input autocomplete="off" name="txtRfc"  id="txtRfc"  type="text" class="form-control" onkeyup="this.value=this.value.toUpperCase();"onkeydown="autocompletar()"/>

<script type="text/javascript">
    // Función autocompletar para RFC
    function autocompletar() {
        var minimo_letras = 0; // minimo letras visibles en el autocompletar
        var palabra = $('#txtRfc').val();
        //Contamos el valor del input mediante una condicional
        if (palabra.length >= minimo_letras) {
            $.ajax({
                type: 'POST',
                data: {palabra:palabra},
                success:function(data){
                    $('#lista_id').show();
                    $('#lista_id').html(data);
                }
            });
        } else {
            //ocultamos la lista
            $('#lista_id').hide();
        }
    }

    // Funcion Mostrar valores
    function set_item(opciones) {
        // Cambiar el valor del formulario input
        $('#txtRfc').val(opciones);
        // ocultar lista de proposiciones
        $('#lista_id').hide();
    };</script>

MUY IMPORTANTE: Dado que en el success tú agregas el contenido venido del servidor en un elemento con id lista_id tendrás que agregar en el DOM un elemento con ese id para que los datos se muestren allí.

10
  • Una disculpa, la falta de etiqueta de cierre fue un error de dedo Commented el 10 ene. 2018 a las 20:30
  • ¿Y aún así no funciona?
    – A. Cedano
    Commented el 10 ene. 2018 a las 20:35
  • No, no funciona porque el error fue al pegar, Sin querer metí el código html y Js en el PHP... U.u Commented el 10 ene. 2018 a las 20:48
  • 1
    @Angela_Gossow, entonces tendrás que cambiar esto: $('#lista_id').html(data); por esto: $('#txtRfc').html(data); Aunque eso no concuerda con la lógica de tu código, ya que lo que tú intentas es ponerlo en un elemento cuyo id es lista_id, sólo que ese elemento no existe en el DOM. Si dejas el jQuery como lo tienes ahora y debajo del input cuyo id es txtRfc tú pones esto: <div id="lista_id"></div> creo que debe funcionar.
    – A. Cedano
    Commented el 16 ene. 2018 a las 17:30
  • 1
    @Angela_Gossow me alegro de que haya resuelto. Por favor revisa el apartado ¿Qué debo hacer cuando alguien contesta mi pregunta?. Saludos.
    – A. Cedano
    Commented el 16 ene. 2018 a las 23:56

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

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