jquery ui autocomplete json

jquery ui autocomplete json

Hello,

I am trying to have autocomplete work. The basic examples from the docs works so I know I am calling the jquery libraries and css fine.

The server returns a json string that looks like this:
[{ 'label': 'Jean', 'value': 1 },{ 'label': 'carl', 'value': 2 },{ 'label': 'Martin', 'value': 3 }]
But the above values do not appear as autocomplete.

I am wondering if my json is proper. Or maybe there is a deeper problem with my codes.

Thanks for any help!

the html is:
  1.    7840               <input type='text' name='q' id='search_string_input' value='enter string to search'
       7841                      onfocus='$(this).val("");' style='font-size: 9px;' />

and the javascript is
  1.    7849               $(function()
       7850               {
       7851               $('#search_string_input').autocomplete
       7852               ({ source: function(request, response)
       7853                  {
       7854                    $.ajax
       7855                    ({ url: '/private_galleries_ajax.php',
       7856                       dataType: 'json',
       7857                       data: { task: 'cmanager_selections_clients_by_field',
       7858                               user_id: user_id,
       7859                               account_id: account_id,
       7860                               field: $('#string_search_field').val(),
       7861                               query: request.term
       7862                             },
       7863                       success: function(data)
       7864                       {
       7865                         data = $.trim(data);
       7866                         response(data);
       7867                       }
       7868                    })
       7869                  },
       7870                  minLength: 2,
       7871                  select: function(event, ui)
       7872                  {
       7873                    search_by_field_client_id = ui.value;
       7874                    cmanager_get_details_by_field();
       7875                  },
       7876                  open: function()
       7877                  {
       7878                    $(this).removeClass('ui-corner-all').addClass('ui-corner-top');
       7879                  },
       7880                  close: function()
       7881                  {
       7882                    $(this).removeClass('ui-corner-top').addClass('ui-corner-all');
       7883                  }
       7884                }
       7885               );
       7886               });