AUtocomplete Jquey

[braa16]

Hola, Buenas.

Quiero hacer un autocompelte en un input. Al escribir la primera letra de una palabra que me muestre todas las palabras de mi base de datos que contenga esa letra.

Tengo lo siguiente: Lo estoy haciendo con Jquery UI.

Primero en mi HTML tengo: El input con un ID y un div para mostra el resultado

Código HTML:

<div class="form-group">  
     <label class="col-lg-4 control-label">Comprobar el nombre:</label>   
            <div id="busqueda"> 
                <input type="text" id="buscar_usuario" name="buscar_usuario"/>  
             </div> 
         <div id="resultados">            
         </div>
</div>
 

Segunto tengo un JS con lo siguiente: El

Código Javascript:

$(function (){
    
        $('#buscar_usuario').autocomplete({ 
            
            source: 'ajax.php'            
            
        });
});
 

En el archivo ajax.php tengo:

Código PHP:

<?php
 
include "/panels/autocomplete.php";  
 
$usuario = new Usuarios ();
 
echo json_encode($usuario->buscarUsuario($_GET['term']));  
 
 
?>
 

Por ultimo en el autocomplete.php

Código PHP:

public function buscarUsuario($nombreUsuario){ 
 
    $dato = array ();
    
    $sql = "SELECT * FROM nota WHERE nombre LIKE '%$$nombreUsuario%' ";   
    
    $resultado = mysqli_query($con, $sql);
    
    while($row = mysqli_fetch_assoc($resultado))
    {
        $dato [] = array("value" => $row['nombre']);            
 
    }
    
    return $datos;
    
}
 

Alguien me puede ayudar no me muestra los campos de la base de datos. El error esta en los archivos, ajax.php, autocomplete.php ya que si pongo en en la funcion de jquery un array source: ['Juan','Pedro'] me los muestra en el imput.

Saludos