Como crear un cuadro de texto que se autocomplete

[eall]

Que afortunado eres amigo. Normalmente me dedico en mi tiempo libre a crear tutoriales para la programación web y para dicha tuya el ultimo tut que creé habla acerca de utilizar un plugin de jQuery llamado autocompletex. te dejo un ejemplo:

Código javascript:

<script type="text/javascript" src="js/jquery.js"></script>
<script type='text/javascript' src="js/jquery.autocomplete.js"></script>
<link rel="stylesheet" type="text/css" href="js/jquery.autocomplete.css" />
<script type="text/javascript" src="js/jquerymenu/jqueryslidemenu.js"></script>
<script type='text/javascript' src="js/jquery.autocomplete.js"></script>
 
<script type="text/javascript" >
 
$(document).ready(function(){
 
        $('#txtNombre').autocomplete('search.php?tip=a&opt=1', {
            width: 260,
            selectFirst: false
        }).result(function(event, data, formatted) {
            $('#txtNombre').val(data[1]);
            $('#txtEdad').val(data[2]);
            $('#txtDireccion').val(data[3]);
            $('#selSexo').val(data[4]);
            $('#selEstCivil').val(data[5]);
        });
});
</script>
 

y el archivo que genera los resultados: "search.php"

Código php:

<?php
session_start();
require_once ("conexion/class.conexionDB.inc.php");
$conn = new conexionBD ( );
extract ( $_GET );
 
/* Consulta a Bases de datos. */
if (isset ( $tip ) && $tip == 'a'){
    if ($opt == 1) {
        $sql = " SELECT DISTINCT
                    PER_NOMBRE,
                    PER_EDAD,
                    PER_DIRECCION,
                    PER_SEXO,
                    PER_ESTCIVIL
                FROM
                    PERSONA";
        if($q != ""){
            $sql .= " WHERE
                        (PER_NOMBRE like N'%$q%')  ";
        }
        $sp = $conn->EjecutarSQL ( $sql );
        //$separador = "MOD: ";
        while ( $row5 = $conn->FetchArray( $sp ) ) {
            $str .= trim ( $row5 [PER_NOMBRE] ) . " $row5[PER_EDAD] - $row5[PER_SEXO]";  //LO QUE SERA MOSTRADO EN EL RECUADRO DESPLEGABLE
            $str .= '|';
            $str .= trim ( $row5 [PER_NOMBRE] ); //LO QUE ASIGNAREMOS AL CAMPO NOMBRE
            $str .= '|';
            $str .= trim ( $row5 [PER_EDAD] );
            $str .= '|';
            $str .= trim ( $row5 [PER_DIRECCION] );
            $str .= '|';
            $str .= trim ( $row5 [PER_SEXO] );
            $str .= '|';
            $str .= trim ( $row5 [PER_ESTCIVIL] );
            $str .= "\n";
        }
    }
}
 
echo $str;
?>
 

si miras mi perfil podrás dar con mi blog.

Espero te sirva.

Adios.