How to implement jquery autocompleter in wordpress

I am trying to make auto complater working in wordpress.

Here is my php code

function autocompleteCallback() {
    global $wpdb; // this is how you get access to the database

    //$whatever = $_POST['search_string'];

    $name=$_POST['search_string'];
   // echo'hiii'. $name='a';
    $employee=$wpdb->get_results("SELECT `user_login` FROM wp_users WHERE user_login LIKE '$name%' ");

    foreach($employee as $key=> $value){
    $myarr[]=array('val' => $value->user_login);
    }

    //wp_reset_query();

    echo json_encode($myarr);

    die(); // this is required to return a proper result
}

add_action('wp_ajax_autocompleteCallback', 'autocompleteCallback');
add_action('wp_ajax_nopriv_autocompleteCallback', 'autocompleteCallback');

Here is my jquery

$(function() {
    //function log( message ) {
    //  $( "<div>" ).text( message ).prependTo( "#log" );
   //   $( "#log" ).scrollTop( 0 );
  //  }
    //alert('huii');

    $("#se").autocomplete({

      //dataType: "json",
      source: function( request, response ) {
                $.ajax({
                    url: './wp-admin/admin-ajax.php',
                    dataType: "json",
                    data: {
                        action: 'autocompleteCallback',
                        search_string:'a',
                       // term: $(options.fieldName).val()
                    },
                    success: function( data ) {
                    //alert(data);
                    alert('huii');
                        response( $.map( data.results, function( item ) {
                            return {
                            alert('hi');
                                label: item.val,
                                ///value: item.title,
                                //url: item.url
                            }
                        }));
                    },
                    error: function(jqXHR, textStatus, errorThrown) {
                        console.log(jqXHR, textStatus, errorThrown);
                    }
                });
            },
      minLength: 1,
      //select: function( event, ui ) {
      //  log( ui.item ?
      //    "Selected: " + ui.item.value + " aka " + ui.item.id :
     //     "Nothing selected, input was " + this.value );
     // }

     // select: function( event, ui ) {
     //   log( ui.item ?
     //     "Selected: " + ui.item.value + " aka " + ui.item.id :
    //      "Nothing selected, input was " + this.value );
    //  }
    });
});

However, I could make this work in normal html, php web site where I passe source as a string. I can’t figure where I have done mistake when I use function for source tag.

html code

<input id ="se" type="text" name="test" width="20" />