DataGrid et Internet Explorer 8

**Loloperso** · 30/09/2009, 10h09

Bonjour,

Mes grilles dojox.grid.DataGrid s'affichent correctement dans FF et dans Chrome et pas dans Internet Explorer 8 (je n'ai pas testé avec le 7).

En fait, elles n'ont aucun formatage, les données s'affichent superposées, etc...

J'ai essayé d'ouvrir http://docs.dojocampus.org/dojox/grid avec IE8 : les grilles ne s'affichent pas non plus !!

Avez-vous le même problème que moi ? Cela signifie-t'il que pour rester compatible, il faut éviter les grilles ?

Merci de votre avis,
Laurent

**emmanuel.remy** · 04/10/2009, 18h11

Salut,

Je n'ai pas de pb particulier avec la 1.3, IE8 et les datagrid.

Concernant le dojo.js, utilises tu un dojo.xd.js (téléchargement depuis google, aol...) ?

ERE

**Loloperso** · 04/10/2009, 18h22

Salut ERE !

Je n'utilise rien chargé depuis Google (ni les autres, mais je n'ai pas essayé AOL & cie) car quand j'ai voulu le faire, beaucoup de choses ne marchaient plus (j'en ai conclu que des éléments dijit ou dojox n'existaient pas dans ces dépôts...).

Je viens de réessayer la page "officielle" de dojox.grid avec IE8, et les exemples ne s'affichent pas : la spinning wheel reste affichée et la barre d'état m'indique qu'il y a des erreurs sur la page. Je copie-colle la boite de dialogue fournie par IE8 :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
Détails de l’erreur de la page Web
 
Agent utilisateur : Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET CLR 1.1.4322; .NET CLR 2.0.50727; .NET CLR 3.0.04506.648; .NET CLR 3.5.21022; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729)
Horodateur : Sun, 4 Oct 2009 16:20:49 UTC
 
 
Message*: 'dojo' est indéfini.
Ligne*: 37
Caractère*: 9
Code*: 0
URI*: http://docs.dojocampus.org/dojox/grid

Alors mon code perso peut très bien être mal fichu, mais il n'en demeure pas moins que cette page officielle, je n'arrive pas à l'ouvrir avec IE8...

Snif, Laurent

**emmanuel.remy** · 05/10/2009, 00h10

J'ai bien vu ça, d'ailleurs j'ai le même bug de mon côté. Par contre dans mes applis la datagrid fonctionne très bine avec IE8.

Peux tu passer le code de ta page une fois le HTML générée, afin de le tester à part ?

ERE

**Loloperso** · 05/10/2009, 09h41

Volontiers Emmanuel !

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
<head>
...
	<link id="themeStyles" rel="stylesheet" href="../../../inclus/js/dijit/themes/soria/soria.css">
	<link rel="stylesheet" href="../../../inclus/site/style.css">
...
	<script type="text/javascript" src="../../../inclus/js/dojo/dojo.js" 
		djConfig="parseOnLoad: false, isDebug: false">
	</script>

	<script type="text/javascript">
		dojo.addOnLoad(function(){
			dojo.require("dijit.layout.BorderContainer");
			dojo.require("dijit.layout.ContentPane");
	
			dojo.require("dijit.MenuBar");
			dojo.require("dijit.MenuItem");
			dojo.require("dijit.Menu");
			dojo.require("dijit.PopupMenuBarItem");
			dojo.require("dijit.PopupMenuItem");
			dojo.require("dojo.parser");

			dojo.addOnLoad(function(){
				dojo.parser.parse();
			});
		});
	 
	</script>
</head>

<body class="soria">

<div dojoType="dijit.layout.BorderContainer" style="width: 100%; height: 100%;"><div dojoType="dijit.MenuBar" id="navMenu" region="top">
...
</div>

<style type="text/css">
	@import "../../../inclus/js/dojox/grid/resources/Grid.css";
	@import "../../../inclus/js/dojox/grid/resources/soriaGrid.css";
</style>

<script type="text/javascript">		
dojo.require("dijit.form.Form");
dojo.require("dijit.form.Button");
dojo.require("dijit.form.DateTextBox");
dojo.require("dojox.grid.DataGrid");
dojo.require("dojo.data.ItemFileReadStore");

function updatedata(){
	dojo.byId("storetitre").innerHTML="-<img src='../../../inclus/filer/images/loading_small.gif'>";
		
	dojo.xhrPost( {
		url: "../../../inclus/xml/deptdb_contenu.php",
		form: dojo.byId("tdbmenu"),
		handleAs: "json",
		timeout: 5000,
		load: function(response, ioArgs) {
			var storenew = new dojo.data.ItemFileReadStore({data: response });
			var grid1 = dijit.byId("grid1");
			grid1.setStore(storenew);
			grid1.attr('structure', response['layout']);
							
			dojo.byId("storetitre").innerHTML = response['titre'];
			dojo.byId("storeteaser").innerHTML = response['teaser'];
			return response;
		},
		error: function(response, ioArgs) {
			dojo.byId("storetitre").innerHTML = response;
			dojo.byId("storeteaser").innerHTML = "";
			return response;
		}
	});
}
</script>

<div dojoType="dijit.layout.ContentPane" region="center">
	
	<h1><div id="storetitre">Liste des articles achetés 
		 : 2009-09-05 -> 2009-10-05</div></h1>

	<div id="storeteaser" style="font-size:80%;"></div>
	
	<span dojoType="dojo.data.ItemFileReadStore" jsId="store1" url="../../../inclus/xml/deptdb_contenu.php"></span>

	<table dojoType="dojox.grid.DataGrid" jsId="grid1" id="grid1" store="store1" selectionMode="single"
		style="width:100%;" autoHeight="true" region="center">
		<thead><tr>
			<th field="nom" width="auto">Vos descriptions</th>
			<th field="ean" width="auto">EAN</th>
		</tr></thead>
		
		<script type="dojo/connect" event="onRowDblClick" args="e">
			if (dijit.byId("tdbmenu").validate()){
				var item = grid1.getItem(e.rowIndex);
				var valeur = grid1.store.getValue(item, "id");
				dijit.byId("grid1id").attr("value", valeur);
				updatedata();
			}
		</script>

	</table>

</div>

On voit qu'il y a un BorderContainer. La grille se trouve dans le "Center" pane.
J'ai essayé de créer la grille de manière programmative mais ça ne change rien. Et puis j'ai d'autres problèmes que je ne sais pas résoudre alors je suis revenu à la méthode déclarative.

Merci beaucoup pour ton aide !!
Laurent

**emmanuel.remy** · 05/10/2009, 23h15

Salut,

Outre le fait qu'il y a des choses un peu bizarre dans ton code (du style pourquoi certains require sont dans un dojo.addOnload et d'autres non

) je pencherai pour une mauvaise position de tes styles

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<style type="text/css">
	@import "../../../inclus/js/dojox/grid/resources/Grid.css";
	@import "../../../inclus/js/dojox/grid/resources/soriaGrid.css";
</style>

Je mettrai ces deux lignes de code dans le header html.

Sinon pour le reste c'est une application prometteuse, et on voit qu'il y a eu du boulot de fait.

ERE

PS: suis dingue de Alf, ai même une figurine ("No problem") qui ne me quitte jamais...

**Loloperso** · 05/10/2009, 23h49

Ca marche !!!!!! T'es un génie

La solution est donc de charger les styles propres aux Grid dans le <header>.

Ca peut être déprimant de galérer parfois des heures sur des erreurs 'simples'... mais merci aux bonnes volontés dans ce cas là !

Quant à Alf et à l'application en question, je les aime bien tous les deux

Alf me vient de l'époque où on ne pouvait mettre que 3 lettres dans les tableaux de high-scores des bornes d'arcades (je suis meilleur en jeux d'arcade qu'en dev, mais je me soigne) ! L'idée de l'application me tient à coeur mais je suis pour l'instant seul dans mon entourage à m'y intéresser, alors faut que j'apprenne tout

Merci encore Emmanuel. Laurent

DataGrid et Internet Explorer 8 [Dojo]

Bibliothèques & Frameworks

Discussions similaires

Partager

Partager