Autocomplete error JqueryUI: Uncaught TypeError: property 'results' of object # <Object> is not a function

Question

I looked around and can not find the answer to my problem. I have not used jquery UI much, but I am trying to implement autocompletion using this jQuery UI Autocomplete blog post with JSON in MVC 4 as a guide because it is almost identical to what I need. I probably missed something “obvious” because I don’t understand all the parts of the autocomplete syntax yet.

Problem: I can get a drop-down list of offers. But as soon as this happens, I get

Uncaught TypeError: Property 'results' of object #<Object> is not a function 

error in the console. In addition, although there are suggestions, I cannot select any of them. the list disappears as soon as I try. Although it may be quite different.

The location of the error in jqueryUI1.9.2 code is the last line in this snippet:

 __response: function( content ) { var message; this._superApply( arguments ); if ( this.options.disabled || this.cancelSearch ) { return; } if ( content && content.length ) { message = this.options.messages.results( content.length ); 

My jquery looks like this:

  $("#FastCategory").autocomplete({ source: function (request, response) { $.ajax({ url: "/Quiz/GetCategory", type: "POST", dataType: "json", data: { term: request.term }, success: function (data) { console.log("data=",data); response($.map(data, function (item) { console.log("item=",item,item.Description); return { label: item.Description, value: item.Description }; })) } }) }, messages: { noResults: "", results: "" } }); 

My controller is as follows:

 public JsonResult GetCategory(string term) { var result = (from r in db.QuizCategories where r.Description.ToLower().Contains(term.ToLower()) select new { r.Description }).Distinct(); return Json(result, JsonRequestBehavior.AllowGet); } 

Any idea where I'm wrong?

Answer 1

As you pointed out in the answer to Narendra, the problem is the messages option. As stated here , the results property in the messages option should be a function instead of a string

 jQuery(...).autocomplete({ messages : { noResults : '', results : function(resultsCount) {} } }); 

Answer 2

It looks like you are referencing a variable and trying to access it as a function.

 __response: function( content ) { var message; this._superApply( arguments ); if ( this.options.disabled || this.cancelSearch ) { return; } if ( content && content.length ) { message = this.options.messages.results=content; 

Just change the code to assign content to the result and it will work.