jQuery Forum

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               });