AJAX KO sur chrome, OK sous FireFox
Bonjour tout le monde !
Je réalise un projet assez gros dans le cadre de mon stage, et je réalise la partie 'récupération de donnée' avec AJAX.
J'utilise Django ( framework web Python) pour gérer la partie donnée et une interface html/javascript utilisant jQuery pour rendre tout ça jolie et efficace.
Le problème que je rencontre est l'appel AJAX lui même. Je m'explique :
Quel que soit le type d'appel AJAX que j'effectue je me retrouve forcément avec un retour d'erreur sous Chrome, et une bonne réponse sous firefox.
Ma requete AJAX fonctionne sous firefox parfaitement, mais pas sous chrome ...
Je ne comprend pas bien d'où viens le problème surtout que je travail sur un exemple extrêmement bateau d'AJAX !
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Demo ajax</title>
<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.13.custom.min.js"></script>
<script type="text/javascript">
$(function(){
$( "a" ).click(function( objEvent ){
$("#ajax-status").empty();
$.ajax(
{
url: $(this).attr( "href" ),
type: "get",
dataType: "html",
error: function(){
ShowStatus( "AJAX - error()" );
$("#content").html( "<p>Page Not Found!!</p>" );
},
beforeSend: function(){
ShowStatus( "AJAX - beforeSend()" );
},
complete: function(){
ShowStatus( "AJAX - complete()" );
},
success: function( strData ){
ShowStatus( "AJAX - success()" );
$("#content").html( strData );
}
}
);
return( false );
});
});
function ShowStatus( strStatus ){
var jStatusList = $("#ajax-status");
jStatusList.append( "<p>" + strStatus + "</p>" );
}
</script>
</head>
<body>
<p>
<a href="./test/about.htm">About</a> -
<a href="./test/contact.htm">Contact</a> -
<a href="./test/office.htm">Office</a> -
</p>
<div id="content" style="float: left ; width: 50% ;">
<p>
Pas de contenu
</p>
</div>
<div id="ajax-status" style="float: right ; width: 45% ;">
</div>
</body>
</html> |
A la racine de ce fichier se trouve bien évidement un répertoire 'test' contenant les fichier about.htm, contact.htm et office.htm contenant chacun un petit morceau de html à récupérer en AJAX.
Aprés plusieurs heures de recherches, je ne trouve toujours pas d'explication je m'en remet donc à vous.
Merci d'avance.
