Question

I have the following function:

  $('#s').autocomplete({
    source: function(request, response) {      
      $.get( http://theurl.com/?ajax=true", {s: request.term }, function(data) { response(data) }, 'json');
    },
    appendTo: "#s-autocomplete",
    minLength: 2,
    select: function(event, ui){
      document.location = ui.item.link;
    },
    complete: function(){
      $("#search-form .searchbt").removeClass('loading');
    }
  }).data("autocomplete")._renderItem = function(ul, item) {                                                                                                   
    $('<li>').data('item.autocomplete', item).append("<a href=" + item.link + " class=" + item.class + ">" + item.label + "</a>").appendTo(ul);
  }

This code works completely fine in all browsers except IE. I have used console.log to debug for the past hour with no luck.

The error I am receiving is “Error: Expected Identifier” and it is happening in ie7 + ie8

I am at a loss, the only insight I can give is when commenting out everything within the ._renderItem I do not receive any errors.

Please help I am going crazy on this one.

jQuery v 1.6.4
jQuery UI 1.8.16

Thank you in advance.

Answer 1

my guess is you’re using class as an object member, and it’s a reserved word in IE JS.

You might try:

}).data("autocomplete")._renderItem = function(ul, item) {
    $('<li>').data('item.autocomplete', item)
        .append("<a href=" + item.link + " class=" + item['class'] + ">" + item.label + "</a>")
        .appendTo(ul);
  }