Arnold Arnold - 3 months ago 167
Javascript Question

continous console error with my jQuery auto complete function

The below is not running and I am constantly getting the '

Uncaught TypeError: $(...) is not a function(anonymous function) @ global.js:80j @ jquery.min.js:2k @ jquery.min.js:2
' which is targeting the line with '
})(jQuery);
' called. I have tried reorganizing my external scripts in the
<head>
of the document, and tried using a JS lint, alas I continue to get this error.

$(document).ready(function() {

$(function($, undefined) {

$.widget("app.autocomplete", $.ui.autocomplete, {

_create: function() {

if (this.element.is("select")) {

var self = this;
this.original = this.element.hide();
this.element = $("<input/>").insertAfter(this.original);

this.options.source = function(request, response) {
var filter = $.ui.autocomplete.filter,
$options = self.original.find("option"),
result = $options.map(function() {
return $(this).val();
});
response(filter(result, request.term));
};

}
this._super("_create");
},

_destroy: function() {
this._super("_destroy");
this.element.remove();
this.original.show();
}

});

})(jQuery);

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

});


Update:

Now, I'm getting this error:

jquery.min.js:4 Uncaught TypeError: f.getClientRects is not a function

Answer

You don't need to pass jQuery variable to a newly created function because $ already has the reference to jQuery function. You got an error because function $ doesn't return a function when a function is passed as the first argument.

$(document).ready(function() {
  $.widget("app.autocomplete", $.ui.autocomplete, {
    _create: function() {
      if(this.element.is("select")) {
        var self = this;
        this.original = this.element.hide();
        this.element = $("<input/>").insertAfter(this.original);
        this.options.source = function(request, response) {
          var filter = $.ui.autocomplete.filter,
            $options = self.original.find("option"),
            result = $options.map(function() {
              return $(this).val();
            });
          response(filter(result, request.term));
        };
      }
      this._super("_create");
    },
    _destroy: function() {
      this._super("_destroy");
      this.element.remove();
      this.original.show();
    }
  });
  $(function() {
    $("#autocomplete").autocomplete();
  });
});