jQuery (1.11) Autocomplete - How do I view the data returned from source?

Question

I want to view the data that autocomplete has after the autocomplete:source "get" request has been fulfilled.

My source is the string: "/jsonplaylist.json". I can see the Get request response by looking at the Firebug console:

["01-List","02-List","03-List","04-List","05-List","06-List","07-List","08-List","08-List","09-List","10-List","playlist01 - updated","playlist02","playlist03"]

But what data does autocomplete have? I believe autocomplete creates a new data structure with "label" and "value". Is there anyway to see that entire data structure?

My autocomplete currently looks like this:

$( "#birds" ).autocomplete({
  source: "/jsonplaylist.json",
  minLength: 1,
  select: function( event, ui ) {
    console.log( ui.item ? "Selected: " + ui.item.value : "Nothing selected, input was " + this.value );
    return false;
  }
 });

I'm using this in a Rails 4 application and it is working correctly. I want to add an "id" to the values in the "get" request and when I do, everything stops working (my get response is an array of arrays), even if I add a _renderItem -- and I am sure the problem is the data, but I don't know how to see the data that autocomplete is working with.

Answer 1

Got it. I misunderstood the autocomplete response event.

http://api.jqueryui.com/autocomplete/#event-response

$( "#birds" ).autocomplete({
  source: "/jsonplaylist.json",
  minLength: 0,
  select: function( event, ui ) {
    console.log(event);
    document.getElementById("birds").value = ui.item.value;
    document.getElementById("birdsID").value = ui.item.id;
    return false;
  },
  response: function(event, ui) { console.log(ui); }
});  // this ends the .data(ui-autocomplete)

Triggered after a search completes, before the menu is shown.