probleme Struts avec les CSS

Version imprimable

02/04/2007, 12h15
ayoub2010

probleme Struts avec les CSS

salut,
je suis entraint de développe une application web en utilisant struts.
le probleme c'est que ma page index.jsp contient des styles CSS.
lorsqu'il ya des champs vide sur cette page (expl: le champ Nom) j'ai configurer struts pour qu'il me rederige vers cette meme page avec des messages d'erreurs dessus.
le probleme c'est que la page est reaffiché avec les messages d'erreurs mais sans Styles CSS et sans images (tel que le LOGO)
pourtant ma premiere page est index.jsp contient tous ces composants.
remarque: j'utilise struts 1.1 si ca peut aider
02/04/2007, 12h27
petitpasdelune

Peux-tu nous montrer cette JSP stp ?

PPDL.

voila ma jsp:

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
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
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
<%@ page contentType="text/html; charset=ISO-8859-1" %>
<%@ taglib uri="/tags/struts-bean" prefix="bean" %>
<%@ taglib uri="/tags/struts-html" prefix="html" %>
<html:html>
<head>
<title>Dossier de candidature</title>
<link type="text/css" rel="stylesheet" href="resources/mon_stile.css" />
<script language="javascript" src="resources/cal2.js">
/*
Xin's Popup calendar script-  Xin Yang (<a href="http://www.yxscripts.com/" target="_blank">http://www.yxscripts.com/</a>)
Script featured on/available at <a href="http://www.dynamicdrive.com/" target="_blank">http://www.dynamicdrive.com/</a>
This notice must stay intact for use
*/
</script>
<script language="javascript" src="resources/cal_conf2.js"></script>
</head>
<body>
<html:form name="AccueilBean" type="Bean.AccueilBean" action="accueil.do" enctype="multipart/form-data">
  <center><table width="779" height="100%" border="1" cellpadding="0" cellspacing="0" bordercolor="#006666" bgcolor="#FFFFFF">
    <tr>
      <td align="left" valign="top"><a name="s"></a><br />
	  <center><table width="760" border="0" cellspacing="1" cellpadding="0" align="center">
        <tr>
          <td width="478"><div align="center" class="Dossier">
            <div align="left" class="Dossier">Dossier de candidature </div>
          </div></td>
          <td width="296"><div align="right"><img src="images/Logo.jpg" alt="logo" width="188" height="52" /></div></td>
        </tr>
      </table></center>
	  <br /><br />
	  <table width="405" border="0" align="center" style="border:1px solid" bordercolor="#000000">
        <tr>
          <td align="center" class="libelle">Nous vous invitons &agrave; remplir ce dossier avec le plus grand soin. Il nous   permettra de mieux appr&eacute;cier vos comp&eacute;tences. Nous vous garantissons une   discr&eacute;tion totale sur les renseignements fournis.</td>
        </tr>
      </table>	 <br /><br />
      <table width="500" border="0" align="center">
        <tr>
          <td align="right" class="libelle">Civilit&eacute; * :</td>
          <td colspan="2" align="left">
              <html:select property="civ" size="1" styleClass="champs" value="Moniseur">
                <html:option value="Moniseur">Moniseur</html:option>
                <html:option value="Madame">Madame</html:option>
                <html:option value="Mademoiselle">Mademoiselle</html:option>
              </html:select>
           </td>
              <td></td>
        </tr>
        <tr>
          <td  align="right" class="libelle">Nom * :</td>
          <td colspan="2" align="left" width="10">
            <html:text property="nom" styleClass="champs" size="40"/>
         </td>
         <td align="left" nowrap="nowrap">
         	<html:errors property="nom"/>
         </td>
         <tr>
          <td class="libelle" align="right">Pr&eacute;nom * : </td>
          <td colspan="2" align="left">
            <html:text property="pren" styleClass="champs" size="40" />
          </td>
          <td></td>
        </tr>
        </tr>
 
        <tr>
          <td class="libelle" align="right">Date de naissance : </td>
          <td width="5">
		  <html:text property="dtn" styleClass="champs" />&nbsp;&nbsp;</td>
          <td align="left"><html:img src="images/date.png"  height="25" width="25" onclick="javascript:showCal('dtn2')"/></td>
        	<td></td>
        </tr>
        <tr>
          <td class="libelle" align="right">Adresse :</td>
          <td colspan="2" align="left">
            <html:text property="adr" styleClass="champs" size="40"/>
          </td>
          <td></td>
        </tr>
        <tr>
          <td class="libelle" align="right">Code postal : </td>
          <td colspan="2" align="left">
            <html:text property="cp" styleClass="champs" size="10"/>
          </td>
          <td></td>
        </tr>
        <tr>
          <td class="libelle" align="right">Ville : </td>
          <td colspan="2" align="left">
            <html:text property="ville" styleClass="champs" size="40"/>
          </td>
          <td></td>
        </tr>
        <tr>
          <td class="libelle" align="right">Pays : </td>
          <td colspan="2" align="left">
            <html:select property="pays" size="1" styleClass="champs" value="Tunisie">
              <html:option value="Tunisie">Tunisie</html:option>
              <html:option value="France">France</html:option>
              <html:option value="Maroc">Maroc</html:option>s
            </html:select>
          </td>
          <td></td>
        </tr>
        <tr>
          <td class="libelle" align="right">T&eacute;l&eacute;phone fixe :</td>
          <td colspan="2" align="left">
            <html:text property="telf" styleClass="champs" size="15"/>
          </td>
          <td></td>
        </tr>
        <tr>
          <td class="libelle" align="right">T&eacute;l&eacute;phone mobile :</td>
          <td colspan="2" align="left">
            <html:text property="telm" styleClass="champs" size="15"/>
          </td>
          <td></td>
        </tr>
        <tr>
          <td class="libelle" align="right">E-mail * : </td>
          <td colspan="2" align="left">
            <html:text property="email" styleClass="champs" size="40"/>
          </td>
          <td></td>
        </tr>
 
        <tr>
          <td class="libelle" align="right">Joindre un CV :</td>
          <td colspan="2"><html:file property="cv" styleClass="champs" size="24"/></td>
		<td></td>        
        </tr>
 
        <tr>
          <td class="libelle"></td>
          <td colspan="2" align="left" class="libelle">&nbsp;</td>
        	<td></td>
        </tr>
        <tr>
          <td height="19" class="libelle"></td>
          <td colspan="2" align="left" class="libelle">* champs obligatoires</td>
        	<td></td>
        </tr>
        <tr>
          <td height="34" class="libelle"></td>
          <td colspan="2" align="right">
          	<html:submit styleClass="champs" value=" Envoyer "></html:submit>&nbsp;&nbsp;
            <html:submit styleClass="champs" value=" Annuler "></html:submit>   
          </td>
          <td></td>
        </tr>
      </table>
    <br />
	    </td>
    </tr>
  </table>
</center>
</html:form>
</body>
</html:html>

02/04/2007, 13h05
maxf1

Le seul probleme qu'il pourrait y avoir est le path de ton fichier css, dans un cas il le trouve, et pas dans l'autre.
02/04/2007, 13h07
_Mac_

C'est quoi l'URL de ton action (cf. struts-config.xml) ? Ce qu'il se passe, c'est que tu utilises des URL relatives à index.jsp pour définir tes ressources (images et CSS) et que ce chemin relatif n'est plus valable après post du formulaire car le path de ton action n'est pas le même que celui de index.jsp. Je ne sais pas si je suis très clair, alors petit exemple :
- Supposons que tu ais index.jsp dans un répertoire rep1. Tu affiches donc ton formulaire pour la première avec http://.../context/rep1/index.jsp.
- Tes images et CSS se trouvent dans rep1/resources. Quand tu affiches ton formulaire pour la première fois, l'URL de la page est http://.../context/rep1/index.jsp et les URL relatives vers tes ressources pointent bien vers rep1/resources (URL absolue = http://.../context/rep1/resources).
- Supposons que l'URL de ton action soit /toto/action.do
- Tu postes donc ton formulaire sur cette URL mais y a des champs vides. Donc tu réaffiches index.jsp. Sauf que pour le navigateur, l'URL de ce que tu affiches est désormais http://.../context/toto/action.do. Donc les URL relatives des ressources ne sont plus bonnes ((URL absolue = http://.../context/toto/resources).

Pour résoudre ton pb, utilise les balises HTML Struts pour afficher les images, etc. de manière à reconstruire systématiquement des URL relatives à la racine du site (URL commençant par /).
02/04/2007, 13h58
ayoub2010

1 pièce(s) jointe(s)

merci pour votre aide, aparament c'est ca le probleme mais je n'arrive quant meme a le resoudre
j'ai essaie de modifier la balise

Code:

<img src="images/Logo.jpg" alt="logo" width="188" height="52" />

en

Code:

<html:img src="/vues/images/Logo.jpg" alt="logo" width="188" height="52" />

sachant que mon arboressence du projet est la suivante :

et ca ne marche pas.
02/04/2007, 14h05
_Mac_

Mets page à la place de src, pour voir ? <html:img page="/vues/images/Logo.jpg" alt="logo" width="188" height="52" />
02/04/2007, 14h50
ayoub2010

merci beaucoup Mac,
pour <html:img page="...."/> ca fonctionne.
mais puisque je suis débutant en struts, comment je vais faire pour transformer le reste :
<link type="text/css" rel="stylesheet" href="resources/mon_stile.css" />
et
<script language="javascript" src="resources/cal_conf2.js"></script>
Merci d'avance

Ce que j'ai fait personnellement dans mon cas (car je n'ai pas trouvé de solution plus "propre"):
Code:

1 2 <bean:define id="link" value="<%=request.getContextPath()%>" /> <link href="${link}/css/style.css" rel="stylesheet" type="text/css">

02/04/2007, 15h46
ayoub2010

merci pour cet aide mais pouvez vous m'expliqué un peut plus le fonctionnement du:
<bean:define id=link ...> et surtout la fonction "request.getContextPath()"
si je comprend un peut "request.getContextPath()" me permet de recuperer le path de mon application dans l'attribut id ??
ensuite j'utilise cet attribut dans
<link href="${link}/css/style.css" ...>
je veut dire ${link} c'est le id="link"?

En gros oui.
Tu as la possibilité de le faire sur la même ligne

Code:

1
2
3
4
5
6
 
<link href="<%=request.getContextPath()%>/css/style.css" rel="stylesheet" type="text/css" />
 
ou plus simplement
 
<link href="./css/style.css" rel="stylesheet" type="text/css" />

A+

02/04/2007, 16h43
ayoub2010

merci beaucoup les gas pour votre aide ca fonctionne en fin :D