jQuery Autocomplete options not showing up

Question

I'm having trouble with jQuery Autocomplete... it doesn't matter what I do it doesnt works... I use json encoding to populate de list but even if the JSON has a valid format it doesn't do anything.

Here is my code:

search_pms_clients.php

<?php

require_once( 'core.php' );

header('Content-type: application/json; charset=utf-8');

class cliente_json {
   var $value;
   var $label;

   function __construct($label, $value, $nombre, $telefono, $zona){
      $this->label = $label;
      $this->value = $value;
    }
}
if (isset($_GET['term'])){

    $return_arr = array();  
    $client = trim(strip_tags($_GET['term']));
    $query = "SELECT tb1.nombre, tb1.id FROM (SELECT DISTINCT nombre, id FROM pms_clients UNION SELECT DISTINCT nombre, id FROM pms_clientsv) AS tb1 WHERE tb1.nombre LIKE '%" . $client . "%' ORDER BY tb1.nombre;";

    $result = db_query_bound( $query );

    // Retrieve and store in array the results of the query.
    while ( $row = db_fetch_array( $result )){

        array_push($return_arr, new cliente_json(utf8_encode(trim($row['id']) . ' - ' . trim($row['nombre'])), utf8_encode(trim($row['id'])) ));

    }
    print_r(json_encode($return_arr));
}
?>

php page making the call:

<script type="text/javascript">
$(function() {
            //autocomplete
            $(".client_select").autocomplete({
                //source: "search_agenda.php",
                source: "search_pms_clients.php",
                minLength: 3,
                select: function ( event, ui ) { // What happens when an autocomplete result is selected
                  console.log('HI');
                },
                change: function( event, ui ) {console.log('test');}
            });
        });
</script>

//more non-related code 

<input tabindex="5" type="text" name="custom_field_96" size="55" maxlength="255" class="custom_field_0 client_select" value="">

The resulting json is well formated (checked at http://www.freeformatter.com/json-validator.html):

For example calling search_pms_clients.php?term=alan%20b throws this json:

[{"value":"49006","label":"49006 - ALAN BAILEY","nombre":"ALAN BAILEY","telefono":"","zona":""},{"value":"59249","label":"59249 - ALAN BALDWIN","nombre":"ALAN BALDWIN","telefono":"","zona":""},{"value":"59164","label":"59164 - ALAN BALDWIN","nombre":"ALAN BALDWIN","telefono":"","zona":""},{"value":"26774","label":"26774 - ALAN BENTLEY","nombre":"ALAN BENTLEY","telefono":"02087485900","zona":""},{"value":"23989","label":"23989 - ALAN BENTLY","nombre":"ALAN BENTLY","telefono":"02087485900","zona":""},{"value":"6265","label":"6265 - ALAN BERRYMAN","nombre":"ALAN BERRYMAN","telefono":"","zona":""},{"value":"12726","label":"12726 - ALAN BICKLE","nombre":"ALAN BICKLE","telefono":"","zona":""},{"value":"1002","label":"1002 - ALAN BLAKENEY","nombre":"ALAN BLAKENEY","telefono":"01883 334577","zona":""},{"value":"79164","label":"79164 - ALAN BROOKS","nombre":"ALAN BROOKS","telefono":"","zona":""},{"value":"5734","label":"5734 - MR ALAN BURNS","nombre":"MR ALAN BURNS","telefono":"","zona":""},{"value":"88494","label":"88494 - MR. ALAN BARNETT","nombre":"MR. ALAN BARNETT","telefono":"","zona":""},{"value":"49771","label":"49771 - MR. ALAN BENTLEY","nombre":"MR. ALAN BENTLEY","telefono":"0208 748 5900","zona":""},{"value":"55117","label":"55117 - MR. ALAN BOWIE","nombre":"MR. ALAN BOWIE","telefono":"","zona":""}]

If I use a simple array instead of my json it works well (more or less the same as here: http://jqueryui.com/autocomplete/#default)

And if I replace the source line by this:

source: function( request, response ) {
        $.ajax({
          url: "http://gd.geobytes.com/AutoCompleteCity",
          dataType: "jsonp",
          data: {
            q: request.term
          },
          success: function( data ) {
            response( data );
          }
        });
      },

it also works flawlessly...

What am I doing wrong? If someone could help me I would really appreciate it.

I'm using jQuery 1.10.2 and jQuery UI 1.11.1