Can someone please explain to me how the Callback functions for JQuery Autocomplete work

I'm trying to get JQuery autocomplete to work with a form whereby you search for the name of an object and the whole object fields are completed with the selected result.

I had autocomplete working well when I just needed to return a string but now I need to return a more complex object.

I've tried to do it with json, and with a string seperated by pipes. The String coming back from the response is fine but autocomplete is not displaying any results.

Can someone tell me what callback I should be using to split my results into an array of strings and how I then access and format those strings for the purpose of displaying them?

Also, what are the parameters for the different callback functions e.g. parse, formatItem, formatMatch, formatResult etc. I'm really confused because nearly every article I've read does it differently and no-one explains what is actually happening.

Why cant I debug a callback in firebug? The code never hits my breakpoints

Here's my javascript

 $(document).ready(


      function ()
        {
            $("input#Venue_Name").autocomplete
            (
// data comes back in format VenueId|Name|AddressLine1|AddressLi开发者_运维问答ne2|City|PostCode|Country
                '<%= Url.Action("FindVenuesComplex","Ajax", new {@area=""}) %>',
                {
                    mustMatch: false,
                parse: function (data)
                {
                    return data.split('|');
                },
                formatItem: function (data)
                {
                    return data[1];
                },
                formatMatch: function (data)
                {

                    return data[1];
                },
                formatResult: function (data)
                {

                    return data[1];
                }
            }
                                ).result
                                (
                                    function (event, data, formatted)
                                    {
                                        if (data)
                                        {
                                            $("input#Venue_AddressLine1").val(data[2]);
                                        }
                                    }
                    );
    }
);

I figured out what was going on and I thought I'd share in case anyone else had the same problem.

I was using the JQuery Autocomplete plugin which has now been replaced with Jquery.UI.AutoComplete which is now part of the core JQuery.UI and the params expected are different.

I'm now using the newer version.

http://theycallmemrjames.blogspot.com/2010/03/jquery-autocomplete-with-aspnet-mvc.html was very helpful in explaining how to use the JQuery.UI version properly