Problem using multiple autocomplete combobox

Problem using multiple autocomplete combobox

Hi, I have a problem, I'm using three jquery autocomplete combobox and I need execute a function when the user select an ítem, this for each  combobox, but I can't do it, all my combobox are filled from a database and  according to this example http://jqueryui.com/autocomplete/#combobox
 
I can't assign a function for each combobox because when I write the event in another script, for example in the head, not is executed any event, but if i write the change event inside the jqueryui's example, it works! but this event is execute for all combobox, and it's impossible execute a funtion for each combobox...
how can do this? Thanks for your help.
 
 
My code:

I tried this in the head, but not works
  1. <head>

  2. $("#combobox").combobox({
  3.       change: function(event, ui) { 
  4.             alert("I'm an event");
  5.       }
  6. });

  8. //or



  10. $("#combobox").autocomplete({
  11.       change: function(event, ui) { 
  12.             alert("I'm an event");
  13.       }
  14. });
  15. </head>


Now i do this (bold text) and it works, but the event is executed for all combobox and I need execute a function for each combobox change event

  1. (function($) {
        $.widget("custom.combobox", {
            _create: function() {
                this.wrapper = $("<span>")
                        //.addClass("custom-combobox")
                        .insertAfter(this.element);
                this.element.hide();
                this._createAutocomplete();
                this._createShowAllButton();
            },
            _createAutocomplete: function() {
                var selected = this.element.children(":selected"),
                        value = selected.val() ? selected.text() : "";
                this.input = $("<input>")
                        .appendTo(this.wrapper)
                        .val(value)
                        .attr("title", "")
                        //.addClass("custom-combobox-input ui-widget ui-widget-content ui-state-default ui-corner-left")
                        .autocomplete({
                    delay: 0,
                    minLength: 0,
                    source: $.proxy(this, "_source"),
                    change: function (event, ui){
                        $("#combobox").autocomplete({
                            change: function(){
                                alert("Soy Proyecto");
                            }
                        });





                       
                    }
                })
                        .tooltip({
                    tooltipClass: "ui-state-highlight"
                });
                this._on(this.input, {
                    autocompleteselect: function(event, ui) {
                        ui.item.option.selected = true;
                        this._trigger("select", event, {
                            item: ui.item.option
                        });
                    },
                    autocompletechange: "_removeIfInvalid"
                });
            },
            _createShowAllButton: function() {
                var input = this.input,
                        wasOpen = false;
                $("<a>")
                        .attr("tabIndex", -1)
                        .attr("title", "Show All Items")
                        .tooltip()
                        .appendTo(this.wrapper)
                        .button({
                    icons: {
                        primary: "ui-icon-triangle-1-s"
                    },
                    text: false
                })
                        .removeClass("ui-corner-all")
                        //.addClass("custom-combobox-toggle ui-corner-right")
                        .mousedown(function() {
                    wasOpen = input.autocomplete("widget").is(":visible");
                })
                        .click(function() {
                    input.focus();
    // Close if already visible
                    if (wasOpen) {
                        return;
                    }
    // Pass empty string as value to search for, displaying all results
                    input.autocomplete("search", "");
                });
            },
            _source: function(request, response) {
                var matcher = new RegExp($.ui.autocomplete.escapeRegex(request.term), "i");
                response(this.element.children("option").map(function() {
                    var text = $(this).text();
                    if (this.value && (!request.term || matcher.test(text)))
                        return {
                            label: text,
                            value: text,
                            option: this
                        };
                }));
            },
            _removeIfInvalid: function(event, ui) {
    // Selected an item, nothing to do
                if (ui.item) {
                    return;
                }
    // Search for a match (case-insensitive)
                var value = this.input.val(),
                        valueLowerCase = value.toLowerCase(),
                        valid = false;
                this.element.children("option").each(function() {
                    if ($(this).text().toLowerCase() === valueLowerCase) {
                        this.selected = valid = true;
                        return false;
                    }
                });
    // Found a match, nothing to do
                if (valid) {
                    return;
                }
    // Remove invalid value
                this.input
                        .val("")
                        .attr("title", value + " didn't match any item")
                        .tooltip("open");
                this.element.val("");
                this._delay(function() {
                    this.input.tooltip("close").attr("title", "");
                }, 2500);
                this.input.data("ui-autocomplete").term = "";
            },
            _destroy: function() {
                this.wrapper.remove();
                this.element.show();
            }
        });
    })(jQuery);


    $(function() {
        $("#combobox").combobox();
    });

    $(function() {
        $("#comboboxTwo").combobox();
    });

    $(function() {
        $("#comboboxThree").combobox();
    });
































































































































How can assign one change event for each combobox and execute the respective function? Thanks for your help!