[PrimeFaces] probleme affichage IE et Edge

Version imprimable

Bonjour,

J'ai un souci avec IE et Edge, la page n'affiche rien, alors que le code y est bien.(ça fonctionne nickel sur Chrome et firefox)
En regardant le source dans Edge, je vois des tag <html> et </html> au milieu de la page. J'utilise pas mal les "include", c'est peut-être à cause de cas ? mais j'ai pas de piste pour le corriger.

merci

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
65
66
67
68
69
 
<?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:ui="http://java.sun.com/jsf/facelets"
    xmlns:c="http://java.sun.com/jsp/jstl/core"
    xmlns:p="http://primefaces.org/ui">
 
<h:head>
	<ui:include src="blocs/header.xhtml"></ui:include>
</h:head>
 
<p:dialog modal="true" widgetVar="statusDialog" header="Status" draggable="false" closable="false" resizable="false">
    <h:outputText value="#{msg['form.calcul.msgDownload']}" />
</p:dialog>
 
<h:body> 
<h:outputText value="#{user.val}" />
	<p:layout >
	    <p:layoutUnit position="north" style="min-height:110px;" >
	       <ui:include src="blocs/nav3.xhtml"></ui:include>
	    </p:layoutUnit>
 
	    <p:layoutUnit position="center" style="min-height:800px;">
 
	    <h:form id="formSaisie">
	        <p:wizard  flowListener="#{calculWizard.onFlowProcess}" nextLabel="Suivant" backLabel="Oups!" style="width:80%;margin:auto">
		        <p:tab id="tabcontrat" title="#{msg['form.calcul.step1']}">
		        <p:messages />
					<ui:include src="blocs/contrat.xhtml"></ui:include>  
		        </p:tab>
 
		 		<p:tab id="tabPatient" title="#{msg['form.calcul.step2']}">
		 		<p:messages />
		 			<ui:include src="blocs/dpatient.xhtml"></ui:include>         
				</p:tab>
 
		        <p:tab id="tabPreop" title="#{msg['form.calcul.step3']}">
		        <p:messages />
		        	<ui:include src="blocs/preop.xhtml"></ui:include>
		        </p:tab>
 
		        <p:tab id="tabonfirm" title="#{msg['form.calcul.step4']}">
    	        <p:messages />
		        	<ui:include src="blocs/confirm2.xhtml"></ui:include>
		        </p:tab>
 
	    	</p:wizard>
	 	</h:form>
 
	    <script type="text/javascript">
			function start() {
			    PF('statusDialog').show();
			}
 
			function stop() {
			    PF('statusDialog').hide();
			}
		</script>
	   </p:layoutUnit>
 
	</p:layout>
 
 
</h:body>
 
</html>

06/03/2018, 09h57
Elwe31

Ce n'est pas a cause des "includes". sans j'ai le même problème.
Supprimer les "p:dialog" toujours pareil.

merci pour votre aide

c'est le <p:layout> qui n'a pas l'air de fonctionner sous IE et Edge.
PrimeFace 6.1
mon navigateur n'affiche que "blabla"

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
<?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:ui="http://java.sun.com/jsf/facelets"
    xmlns:c="http://java.sun.com/jsp/jstl/core"
    xmlns:p="http://primefaces.org/ui">
 
<h:head>
	<title>#{msg['form.titre']}</title>
 
	<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9"  />
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta content="text/html;" http-equiv="Content-Type"/>
	<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</h:head>
 
 
<h:body> 
  <h:form id="formSaisie">
 
<h:outputText value="blabla" />
	<p:layout >
	    <p:layoutUnit position="north" style="min-height:110px;" >
	       <h:outputText value="Nord" />
	    </p:layoutUnit>
 
	    <p:layoutUnit position="center" style="min-height:800px;">
	    <h:outputText value="center" />
	   </p:layoutUnit>
 
	</p:layout>
 
	 	</h:form>
</h:body>
 
</html>

06/03/2018, 17h01
VirgApps

Bonjour,
une piste serait de regarder le code HTML généré par le composant <p:layout> et s'assurer qu'il est "compatible" avec IE et Edge...

Après pour tout ce qui concerne la mise en forme et le placement de composant, je me tournerai vers du HTML/CSS3 natif et j'éviterai les composants Primefaces dédié à la mise en forme surtout dans ton exemple s'il s'agit simplement de placer deux div l'un à coté de l'autre.
06/03/2018, 17h04
OButterlin
J'utilise un <p:layout> et ça fonctionne sous IE11.
N'ayant pas de machine W10, je ne peux pas dire pour Edge...
Ceci dit, la balise est paramétrée comme ceci
Code:

1 2 3 4 <p:layout fullPage="true"> ... </p:layout>
Est-ce que ça fait une différence chez toi ?
06/03/2018, 17h07
VirgApps

Je dérive un peu mais pour ton besoin de placement tu peux le gérer avec les flexbox (qui sont un peu la solution à tout :D) :

https://css-tricks.com/snippets/css/a-guide-to-flexbox/
07/03/2018, 08h56
Elwe31
Citation:
Envoyé par OButterlin

Code:

1 2 3 4 <p:layout fullPage="true"> ... </p:layout>
Nickel, ça fonctionne en ajoutant fullPage="true".

merci