Question

The following code is giving me problems in IE. IE is telling me that there is a security risk and prohibits the code to function.

$("#searchbox").autocomplete({ 
  source: function(request, response) {
    $.ajax({
      url: 'http://query.yahooapis.com/v1/public/streaming/yql',
      dataType: 'JSONP',
      data: {
        format: 'json',
        q: 'select * from xml where url="http://google.com/complete/search?hl=nl&output=toolbar&q=' + encodeURIComponent(request.term) + '"'
      },
      success: function(data) {
        if (typeof data == 'string') data = $.parseJSON(data);
        response(
          $.map(data.query.results.toplevel.CompleteSuggestion, function(item) {
            return { label: item.suggestion.data, value: item.suggestion.data };
          })
        );
      }
    });
  },
  select: function(e, ui){
  },
  open: function(){
    doSearch($('.ui-autocomplete li:first-child a').text(), true, false);
    $(".ui-autocomplete :first-child a").addClass("ui-state-hover");
    $("#searchbox").focus();
    return false;
  },
  select: function(e, ui){
    $("#searchbox").autocomplete('search', ui.item.value);
  },
  close: function (event, ui) {
    val = $("#searchbox").val();
    $("#searchbox").autocomplete( "search", val ); 
  }
});

I have done some investigation and it turns out that this line is giving me the problem: url: 'http://query.yahooapis.com/v1/public/streaming/yql',

So I was wondering with what I can replace or what to modify to make it work. Here is a live version: JsBin

Answer 1

This looks like its maybe a Cross Domain Request, which is a pain in my experience.

You will need to use XDR calls (not supported in all IE versions), OR you will need to use a reverse proxy from your host… See this article: http://blogs.msdn.com/b/ieinternals/archive/2010/05/13/xdomainrequest-restrictions-limitations-and-workarounds.aspx