title: jQuery ui.combobox and asp.net web forms autopostback
body: <p>I'm using the autocombox from the jQuery UI library (http://jqueryui.com/demos/autocomplete/#combobox). The combobox is replacing a standard asp.net web forms dropdownlist control with it's autopostback property set to true. Is there a way I can 'inherit' the event handler on this control or is there a way I can identify that a 'select' or 'change' event has happened in the combobox so I can fire off a postback myself?</p>
  
  <p>EDIT:</p>
  
  <p>Adding my combobox code:</p>
  
  <pre><code>    (function($) {
    $.widget("ui.combobox", {
  
      _create: function() {
        var self = this;
        var width = this.element.width() &gt; 100 ? "style='width:"+this.element.width()+"px'" : "";
          self.select = this.element.hide();
        var v = self.select.children(":selected").text();
        self.span = $("&lt;span&gt;")
        .insertAfter(self.select)
        .addClass(self.select.attr("class"))
        .addClass("ui-combobox");
        self.input = $("&lt;input "+width+"&gt;")
        .appendTo(self.span)
        .autocomplete({
          source: function(request, response) {
            var matcher = new RegExp(request.term, "i");
            response(self.select.children("option").map(function() {
              var text = $(this).text();
              if (!request.term || matcher.test(text))
              return {
                id: $(this).val(),
                label: text.replace(new RegExp("(?![^&amp;;]+;)(?!&lt;[^&lt;&gt;]*)(" +
                        request.term.replace(/([\^\$\(\)\[\]\{\}\*\.\+\?\|\\])/gi,
                        "\\$1") + ")(?![^&lt;&gt;]*&gt;)(?![^&amp;;]+;)", "gi"), "&lt;strong&gt;$1&lt;/strong&gt;"),
                value: text
              };
            }));
          },
  
          delay: 0,
          select: function(e, ui) {
            if (!ui.item) {
              // remove invalid value, as it didn't match anything
              $(this).val("");
              return false;
            }
            $(this).focus();
            self.select.val(ui.item.id);
            self._trigger("selected", null, {
              item: self.select.find("[value='" + ui.item.id + "']")
            });
          },
          change: function(event, ui) {
            if ( !ui.item ) {
              var matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( $(this).val() ) + "$", "i" ),
              valid = false;
              select.children( "option" ).each(function() {
                if ( this.value.match( matcher ) ) {
                  this.selected = valid = true;
                  return false;
                }
              });
              if ( !valid ) {
                // remove invalid value, as it didn't match anything
                $( this ).val( "" );
                select.val( "" );
                return false;
              }
            }
          },
          minLength: 0
        })
        .val(v)
        .addClass(self.select.attr("class"))
        .addClass("ui-widget-content ui-corner-left ui-combobox-input")
        .myHover();
        $("&lt;div&gt;&lt;/div&gt;")
        .appendTo(self.span)
        .button({
          icons: {
            primary: "ui-icon-triangle-1-s"
          },
          text: false
        }).removeClass("ui-corner-all")
        .addClass(self.select.attr("class"))
        .addClass("ui-corner-right ui-button-icon ui-combobox-button")
        .position({
          my: "left center",
          at: "right center",
          of: self.input,
          offset: "-1 0"
        })//.css("top", "")
        .click(function() {
          // close if already visible
          if (self.input.autocomplete("widget").is(":visible")) {
            self.input.autocomplete("close");
            return;
          }
          // pass empty string as value to search for, displaying all results
          self.input.autocomplete("search", "");
          self.input.focus();
          self.input.get(0).select();
        });
      },
      setValue: function(v) {
          this.select.val(v);
          this.input.val(this.select.children(":selected").text());
      }
      //_trigger("change", e, ui);
    });
  })(jQuery);
  </code></pre>