IE Incompatible PrimeFaces ?

**kayri** · 09/01/2014, 10h50

Bonjour,

J'ai réalisé une application web qui a pour but de lire une BDD et celle-ci fonctionne, seulement elle tourne sur Firefox et non sur IE.

Je me suis renseigné (mais c'est peut être pas ça) et le problème pourrait venir de PrimeFaces.

J'ai un Tree, il s'affiche mais si je souhaite le dérouler par un clic sur la petite flèche, il ne fait rien. Pourtant l'application fonctionne puisqu'il me donne des infos de ma BDD dans le Tree.

On dirait que c'est plus un souci d'affichage que de fonctionnement. Un peu comme s'il ne voulait réaliser aucune animation.

Voici mon code

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
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui">
<h:head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="fr-fr" />
 
<title>Kayri Application Server Eyes</title>
 
<link rel="stylesheet" href="Template/style.css" type="text/css" />
 
<script type="text/javascript">
setInterval(function JSRefresh() {
$("#formRefresh\\:BtnRefresh").click();
}, 60 * 1000);
</script>
 
</h:head>
<h:body>
<div style="height: 20px" />
<div id="p_server">
<div style="height: 50px" />
<div id="p_ts">
 
<h:form>
 
<p:growl id="tree_server" showDetail="true" escape="false" />
 
<p:tree value="#{treeBean.LServer}" var="node" dynamic="true"
selectionMode="checkbox" selection="#{treeBean.selectedNodes}">
 
<p:treeNode>
<h:outputText value="#{node}" />
</p:treeNode>
</p:tree>
 
<!-- Display Selected -->
<p:commandButton value="Display Selected" update="tree_server"
onclick="JSRefresh()"
actionListener="#{treeBean.Selected}" id="btnDisplay">
 
</p:commandButton>
 
<!-- Refresh Tree Server -->
<p:commandButton id="BtnTreeRefresh" value="Refresh Server List"
actionListener="#{treeBean.TreeRefrech}" onclick="JSRefresh()">
<!-- parameters, more action listeners, etc. -->
</p:commandButton>
 
</h:form>
 
</div>
</div>
 
<div id="p_data">
<div style="height: 50px" />
<p:scrollPanel style="height: 80%" dynamic="true" mode="native">
<h:form id="form">
 
<p:growl id="growl" showDetail="true" autoUpdate="true"/>
 
<p:dataTable id="dataTable" value="#{read.listServer}" var="etat"
partialTrigger="testing"  
rowStyleClass="#{colorSelectorRow.computeColor(etat.timeLg , etat.etat , etat.today)}">
 
<f:facet name="header">  
            Information des serveur selectionné  
        </f:facet>
<p:column style="width:5%">
<p:rowToggler />
</p:column>
<p:column sortBy="server" headerText="Serveur" style="width:30%">
<h:outputText value="#{etat.server}" />
</p:column>
<p:column sortBy="pack" headerText="Package" style="width:30%">
<h:outputText value="#{etat.pack}" />
</p:column>
<p:column sortBy="date" headerText="Date" style="width:15%">
<h:outputText value="#{etat.date}" />
</p:column>
<p:column sortBy="time" headerText="Heure début" style="width:15%">
<h:outputText value="#{etat.time}" />
</p:column>
<p:column sortBy="etat" headerText="Etat" style="width:5%">
<h:outputText value="#{etat.etat}" />
</p:column>
 
<p:rowExpansion>
 
<h:panelGrid id="display" columns="2" cellpadding="4"
styleClass=" ui-widget-content grid">
 
<f:facet name="header" value="#{etat.server}" />
 
<h:outputText value="Type :" />
<h:outputText value="#{etat.type}" />
 
<h:outputText value="Heure Update:" />
<h:outputText value="#{etat.timeUp}" />
 
<h:outputText value="Temps écoulé" />
<h:outputText value="#{etat.timeDif}" />
 
</h:panelGrid>
</p:rowExpansion>
</p:dataTable>
<h:outputText id="rp_out" value="Temps de rapport d'erreur (en minutes) :" style="margin-left: 10px;font-weight:bold;color:black;position:absolute;bottom:10%;"/>
<h:inputText id="rp_in" value="#{colorSelectorRow.min}" style="width: 30px; margin-left: 370px; position:absolute;bottom:10%;"/>
</h:form>
</p:scrollPanel>
 
</div>
 
<h:form id="formRefresh">
 
<!-- Refresh Serveur sélectionné -->
<h:commandLink id="BtnRefresh" style="display:none;"
actionListener="#{read.FonctionRefresh}">
<!-- parameters, more action listeners, etc. -->
</h:commandLink>
 
</h:form>
</h:body>
</html>

Quelqu'un saurait-il m'indiquer d'où peut venir le problème ?

Merci d'avance pour votre aide.

**toutgrego** · 09/01/2014, 13h31

Peut-être des éléments du CSS qui ne sont pas supportés sous IE. C'est quelle version de IE ?

**kayri** · 09/01/2014, 14h09

IE9.
J'ai regardé avec IEtester et aucun des versions ne fonctionne, par contre j'ai un vieux message d'erreur de script. Le genre de message qui ne précise rien:
"Une erreur est survenue dans le script de cette page."
erreur: "$" est indéfinie ou encore "primefaces" est indéfinie

Se pourrait il que mon script soit mal lu par IE?
Au plus je cherche une solution, au plus je n'y comprend rien ^^

Une idée?

**OButterlin** · 09/01/2014, 16h18

Il y a un problème avec Primefaces et IE si l'option d'affichage de compatibilité est activée.

Pour vérifier si le problème vient de là, dans IE :
-> Outils -> Paramètres d'affichage de compatibilité

Décocher les 2 premières cases à cocher (si besoin)

Ensuite, je ne sais plus s'il faut relancer le navigateur, dans le doute, ferme tout et refait le test

**kayri** · 09/01/2014, 16h35

IE de m.... Enfin, quand on demande une solution IE il faut respecter...

Merci beaucoup

Autre question, il est possible d'avoir un moyen qui évite de toucher au config?
Car si c'est à déployer sur 100 poste, je ne me vois pas expliquer à 100 personnes pourquoi ça ne fonctionne pas..

**OButterlin** · 10/01/2014, 08h48

A ma connaissance, on ne peut pas influer sur ce paramètre lorsqu'il a été fixé sur la navigateur. Chez nous, on a fait modifier l'image d'installation des postes pour supprimer ce paramètre...
De mémoire, le DOCTYPE a une influence sur ce "truc"... censé compenser à la base (quand même), l'incapacité de certains développeurs de faire correctement leur boulot et de faire des css répondant à la norme... (ex. width:150; au lieu de width:150px (ou tout autre unité valide))

Du reste, Firefox peut aussi passer en mode "compatibilité" mais on ne peut pas le forcer (que je sache)

**Bovino** · 10/01/2014, 11h09

IE de m...

En l’occurrence, ce n'est pas IE qu'il faut blâmer, mais ton code...

La première chose que doit rencontrer le navigateur (quel qu'il soit) pour pouvoir interpréter correctement un document, c'est le doctype. Si tu n'en mets pas, ne reproche pas à IE de te dire qu'il ne sait pas comment doit être interprété ton document et donc de basculer en mode de compatibilité...
Avec

Code html :

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

<!doctype html>

en tout début de fichier, ton problème devrait se résoudre tout seul.

**kayri** · 10/01/2014, 12h25

Bonjour Bovino et merci de ta réponse,

Envoyé par Bovino

La première chose que doit rencontrer le navigateur (quel qu'il soit) pour pouvoir interpréter correctement un document, c'est le doctype. Si tu n'en mets pas, ne reproche pas à IE de te dire qu'il ne sait pas comment doit être interprété ton document et donc de basculer en mode de compatibilité...

J'ai oublier de copier coller mes 2 première ligne, mais mon doctype est bien présent. Pardonnez ma fourberie

Code :

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

1
2
3
4
5
6
7
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">
<h:head>

Après tu as peut-être raison, il y a peut-être (surement) une erreur dans mon code. Je ne suis que débutant mais j'espère devenir meilleur.

**Bovino** · 10/01/2014, 13h39

Alors dans ce cas, c'est plus vicieux : l'entête XML <?xml version='1.0' encoding='UTF-8' ?> n'est pas autorisé par IE avant le doctype (et pas plus après du reste...) ce qui le fait aussi passer en mode de compatibilité.