2010-09-21 6 views
0

Ce code fonctionne dans Firefox mais pas IE. Des idées? J'utilise les dernières bibliothèques jQuery-ui.jquery ui autocomplete - ne fonctionne pas dans IE

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="UTF-8" /> 
<title>jQuery UI Autocomplete Remote datasource demo</title> 
<link type="text/css" href="jquery.ui.all.css" rel="stylesheet" /> 
<script type="text/javascript" src="jquery-1.4.2.js"></script> 
<script type="text/javascript" src="jquery.ui.core.js"></script> 
<script type="text/javascript" src="jquery.ui.widget.js"></script> 
<script type="text/javascript" src="jquery.ui.position.js"></script> 
<script type="text/javascript" src="jquery.ui.autocomplete.js"></script> 
<link type="text/css" href="demos.css" rel="stylesheet" /> 
<style type="text/css"> 
.ui-autocomplete-loading { background: white url('images/ui-anim_basic_16x16.gif')  right center no-repeat; } 
.ui-autocomplete { 
    overflow-y: auto; 
    max-width: 400px; 
} 
/* IE 6 doesn't support max-width 
    * we use width instead, but this forces the menu to always be this wide 
    */ 
* html .ui-autocomplete { 
    width: 400px; 
} 
</style> 
<script type="text/javascript"> 

$(function() { 
function log(message) { 
    $("<div/>").text(message).prependTo("#log"); 
    $("#log").attr("scrollTop", 0); 
} 

$.ajax({ 
    url: "links2.xml", 
    dataType: "xml", 
    success: function(xmlResponse) { 
    var data = $("ROW", xmlResponse).map(function() { 
    return { 
     value: $("SC_DF_FIELD_1", this).text(), 
     url: $("SC_DF_FIELD_2", this).text(), 
     support_url: $("SC_DF_FIELD_3", this).text(), 
     description: $("SC_DF_FIELD_4", this).text(), 
     contact: $("SC_DF_PERSON_LINK", this).text() 

    }; 
    }).get(); 

    $("#_results").autocomplete({ 
    source: data, 
    minLength: 0 

    }).data("autocomplete")._renderItem = function(ul, item) { 
    return $("<li></li>") 
    .data("item.autocomplete", item) 
    .append("<a>" + item.value + "<br>" + item.url + "<br>" + item.description + "<br>" + "Support URL: " + item.support_url + "<br>" + "Contact: " + "<a href=" + item.contact + ">Test</a>" + "<br />" + "</a>") 
    .appendTo(ul); 
} 

    } 
}) 

}); 
</script> 

Recherche:

Répondre

0

Le code fonctionne pour moi dans IE. La seule différence que je vois est que j'utilise la version googleapis de jquery et jQueryUI:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.js"></script> 

La seule autre différence possible est le balisage puisque vous ne l'avez pas poster le vôtre. Je viens d'une entrée comme ceci:

<input type="text" id="_results" /> 
+0

En chrome, je vois que je reçois une erreur "Origin null n'est pas autorisé par Access-Control-Allow-Origin" Changer ma source pour le googleapi ne le corrige pas dans IE ou chrome. Je reçois toujours la même erreur en chrome. – specked

+0

J'utilise aussi la même entrée – specked

+0

C'est étrange. Cette erreur ressemble à une erreur ajax interdomaine. Mais je ne sais pas pourquoi cela fonctionnerait dans FF si c'était le problème. Le fichier links2.xml se trouve-t-il sur le même domaine que votre page qui effectue l'ajax? – fehays