jQuery UI Autocomplete: How to base on JSON data NOT name & Label

I've got an AJAX url that returns data in the following format:

[{ "product": "Zip a dee doo dah", "desc": "F oq nfp  gd r exbiikr wblkjm yumdd  xy voqgt d   hjtk. As  sr ywvgiyb iqoibgm akron slfudtq smabx gj awlbtp ji vb do prvhlqq. ", "type": "Doodahs", "price": "3.99"}]

I'm trying to get the auto-complete to be based on the "product" entry.

Here is my code. It sends the request like it should, but I can't seem to get the auto-complete to populate the value based on 'product'. I'm sure I'm overlooking something stupid, but I've been staring at this for a few hours and figured its time to see if someone can help ;-).

Thanks for your help!

$(document).ready(function() {

    $( "input[type='text']" ).autocomplete({
      source: function( request, response ) {
        $.ajax({
            dataType: "json",
            type : 'POST',
            data: 'q=' + prepareInput(this.element.attr('name') + '=' + request.term),
            success: function(data) {
              $('input.suggest-user').removeClass('ui-autocomplete-loading');  
              return $.map( data, function(item) {
                var r = $.parseJSON(data);
                return {
                    label: r['product'],
                    value: r['product']
                };
             });
          },
          error: function(data) {
              $('input.suggest-user').removeClass('ui-autocomplete-loading');  
          }
        });
      },
      minLength: 3
    });

});

--------------- Still not working, but current code below ------------------------

$(document).ready(function() {

$( "input[type='text']" ).autocomplete({
  source: function( request, response ) {
    $.ajax({
        dataType: "json",
        type : 'POST',
        data: 'q=' + prepareInput(this.element.attr('name') + '=' + request.term),
        success: function(data) {
          $('input.suggest-user').removeClass('ui-autocomplete-loading');  // hide loading image
          return $.map( data, function(item) {
            console.log(item['product']);
            return {
                label: item['product'],
                value: item['product']
            };
         });
      },
      error: function(data) {
          $('input.suggest-user').removeClass('ui-autocomplete-loading');  
      }
    });
  },
  minLength: 3
});

Console.log is currently writing out the proper value, but the auto-complete still isn't popping up.

--- Working Code Below - Finally Got it Running. Thanks @Robert --------------

I was missing a number of things: 1) It needs to be an array, so I added []. 2) Apparently the format needs to be assigned to "response".

Now its working...

$(document).ready(function() {

$( "input[type='text']" ).autocomplete({
  source: function( request, response ) {
    $.ajax({
        dataType: "json",
        type : 'POST',
        data: 'q=' + prepareInput(this.element.attr('name') + '=' + request.term),
        success: function(data) {
          $('input.suggest-user').removeClass('ui-autocomplete-loading');  // hide loading image
          return $.map( data, function(item) {
            response([{
                label: item['product'],
                value: item['product']
            }]);
         });
      },
      error: function(data) {
          $('input.suggest-user').removeClass('ui-autocomplete-loading');  
      }
    });
  },
  minLength: 3
});