bug lien HREF sous Internet Explorer

Bonjour à tous,

Je développe une appli web Java avec Struts 1.3.9.

J'ai un petit problème de fonctionnement sous IE 7(aucun sur Mozilla).

Voilà, j'ai deux liens dans ma JSP ("ajouter" et "supprimer") qui permettent à l'utilisateur d'ajouter ou de supprimer dynamiquement dans la JSP un champ de Formules (à l'aide de javascript)

L'ajout se fait bien sur Firefox mais sur IE, il l'interprête mal et me renvoie à la page d'accueil de l'appli.

Dois-je remplacer les balises href ?

Vous trouverez ci-après, le code de ma JSP et j'ai marqué en rouge les parties qui nous intéressent.

Merci pour vos réponses.

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
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>

<%@ taglib uri="http://struts.apache.org/tags-bean" prefix="bean" %>
<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html" %>
<%@ taglib uri="http://struts.apache.org/tags-logic" prefix="logic" %>
<%@ taglib uri="http://struts-menu.sf.net/tag" prefix="menu" %>
<%@ taglib uri="http://displaytag.sf.net" prefix="display" %>

<div id="fil">
	<ul>
		<li><a href="${pageContext.request.contextPath}/welcome.do">Accueil ></a></li>
		<li><a href="${pageContext.request.contextPath}/indicateursliste.do">Indicateurs ></a></li>
		<li><a>Formulaire de création</a></li>
	</ul>
</div>
<script language="javascript" type="text/javascript" src="${pageContext.request.contextPath}/vues/script/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({
	mode : "textareas",
	language : "fr",
});
$(document).ready(function(){
	if ($("input[name=duree][value=1]").is(':checked')){
		$("input[name=periode]").attr("disabled","disabled");
	};
	if ($("input[name=duree][value=2]").is(':checked')){
		$("input[name=cumul_an]").attr("disabled","disabled");
	};
	$("input[name=duree][value=1]").click( function(){
		$("input[name=periode]").attr("disabled","disabled");
		{$("input[name=cumul_an]").attr("disabled","");}
	});
	$("input[name=duree][value=2]").click( function(){
		$("input[name=periode]").attr("disabled","");
		{$("input[name=cumul_an]").attr("disabled","disabled");}
	});
	$("a.ajouter").click( function(event){
		event.preventDefault();
		$("input[name=modification]").attr("value","1");
		{$("form").attr("action","${pageContext.request.contextPath}/indicateurscreateformupdate.do").submit();}
	});
	$("a.supprimer").click( function(event){
		event.preventDefault();
		$("input[name=modification]").attr("value","2");
		{$("form").attr("action","${pageContext.request.contextPath}/indicateurscreateformupdate.do").submit();}
	});
	$("a.reset").click( function(event){
		event.preventDefault();
		$("input[name=modification]").attr("value","0");
		{$("form").attr("action","${pageContext.request.contextPath}/indicateurscreateformupdate.do").submit();}
	});
});
</script>
<div class="dotbloc">
<html:errors/>
<html:form action="/indicateurscreate.do">
		<div class="title">Création d'un indicateur</div>
		<table class="formindic">
			<tr>
				<td class="label">Indicateur</td>
				<td><html:text property="libelle"/></td>
				<td class="label">Multiplicateur</td>
				<td><html:text property="multiplicateur"/></td>
			</tr>
			<tr>
				<td class="label">Politique Qualite</td>
				<td>
					<html:select property="opq">
						<html:optionsCollection name="opqCIndic" value="idbase" label="libelle"/>
					</html:select>
				</td>
				<td class="label">Valeur d'ajustement</td>
				<td><html:text property="val_ajust"/></td>
			</tr>
			<tr>
				<td class="label" rowspan="7">Definition</td>
				<td rowspan="7"><html:textarea  cols="38" rows="10" property="definition"></html:textarea></td>
				<td class="label">Nombre de décimales</td>
				<td><html:text property="nb_decimal"/></td>
			</tr>
			<tr>
				<td class="label">Unité</td>
				<td><html:select property="unite">
						<html:option value="%"></html:option>
					</html:select>
				</td>
			</tr>
			<tr>
				<td class="label">Cumul Entite</td>
				<td><html:select property="cumulentite" >
						<html:option value="oui"></html:option>
						<html:option value="non"></html:option>
					</html:select>
				</td>
			</tr>
			<tr>
				<td class="label">Annee Civile</td>
				<td><html:radio property="duree"  value="1"/></td>
			</tr>
			<tr>
				<td class="label">Cumul Annuel</td>
				<td><html:select property="cumul_an">
						<html:option value="oui"></html:option>
						<html:option value="non"></html:option>
					</html:select>
				</td>
			</tr>
			<tr>
				<td class="label">Periode glissante</td>
				<td><html:radio property="duree"  value="2"/></td>
			</tr>
			<tr>
				<td class="label">Periode</td>
				<td><html:text property="periode" size="2"/></td>
			</tr>
		</table>
		<div class="dotbloc">
			<div class="title">Formule</div>
			<logic:iterate id="formule" name="formules" type="com.indicateurs.business.beans.Formule" indexId="compt">
				Donnée de base
				<html:select property="db${compt}">
					<html:optionsCollection name="dbCIndic" value="idbase" label="libelle"/>
				</html:select>
				&nbsp;&nbsp;
				opérande
				<html:select property="type${compt}">
					<html:option value="1">Numerateur</html:option>
					<html:option value="2">Denominateur</html:option>
				</html:select>
				&nbsp;&nbsp;
				operation
				<html:select property="op${compt}">
					<html:option value=""></html:option>
					<html:option value="+">+</html:option>
					<html:option value="-">-</html:option>
					<html:option value="*">*</html:option>
					<html:option value="/">/</html:option>
				</html:select>
				&nbsp;&nbsp;
				sequence
				<html:text property="seq${compt}" size="2"/>
				<br>
			</logic:iterate>
		</div>
		<a href=""  class="ajouter">ajouter</a>
		<a href="" class="supprimer">supprimer</a>
		<br>
		<br>
		<div class="dotbloc">
			<div class="title">Objectif</div>			
			<table class="objs">
				<tr>
					<td>Année</td>
					<td>Obj. An.</td>
					<td>Janv.</td>
					<td>Fév.</td>
					<td>Mars</td>
					<td>Avril</td>
					<td>Mai</td>
					<td>Juin</td>
					<td>Juil.</td>
					<td>Août</td>
					<td>Sept.</td>
					<td>Oct.</td>
					<td>Nov.</td>
					<td>Déc.</td>
				</tr>
				<logic:iterate id="annee" name="AFIndicateur" property="objs" indexId="ind" >
				<tr>
					<td><bean:write name="AFIndicateur" property="objs[${ind}].annee"/></td>
					<td><html:checkbox value="1" property="objs[${ind}].objAn"/></td>
					<td><html:text property="objs[${ind}].janvier" size="1"/></td>
					<td><html:text property="objs[${ind}].fevrier" size="1"/></td>
					<td><html:text property="objs[${ind}].mars" size="1"/></td>
					<td><html:text property="objs[${ind}].avril" size="1"/></td>
					<td><html:text property="objs[${ind}].mai" size="1"/></td>
					<td><html:text property="objs[${ind}].juin" size="1"/></td>
					<td><html:text property="objs[${ind}].juillet" size="1"/></td>
					<td><html:text property="objs[${ind}].aout" size="1"/></td>
					<td><html:text property="objs[${ind}].septembre" size="1"/></td>
					<td><html:text property="objs[${ind}].octobre" size="1"/></td>
					<td><html:text property="objs[${ind}].novembre" size="1"/></td>
					<td><html:text property="objs[${ind}].decembre" size="1"/></td>
				</tr>
				</logic:iterate>
			</table>
		</div>
		<html:hidden property="modification"/>
		<html:submit styleClass="submit"><bean:message key="bouton.creer"/></html:submit>
		<a href="" class="reset">reset</a>
</html:form>
</div>

pas de réponse à ma question ? Ca doit pourtant être un bug connu d'IE mais n'étant pas un expert, je n'ai pas trouvé de solution. Merci de m'aider.

Ton problème doit venir de event.preventDefault().
Pour la compatibilité, il faudrait faire (vu sur le site)
Code:

1 2 3 4 5 6 7 var event = event || window.event; if (event.preventDefault) { event.preventDefault(); // FF } event.returnValue = false; // IE
A+

Merci OButterlin pour ta réponse. Malheureusement le bug reste entier sous IE : il interprète le lien href comme un renvoi à l'accueil de l'appli... Il ne passe apparemment meme pas dans le javascript.
Code:

1 2 3 4 5 6 7 8 9 10 11 12 $("a.ajouter").click( function(event){ event = event || window.event; if (event.preventDefault) { event.preventDefault(); // FF } event.returnValue = false; // IE $("input[name=modification]").attr("value","1"); {$("form").attr("action","${pageContext.request.contextPath}/indicateurscreateformupdate.do").submit();} });
Code:

<a href="" class="ajouter">ajouter</a>

Merci d'avance pour votre aide.

Si je comprends bien ta démarche, tu cherches à modifier le nom de l'Action de ton formulaire quand tu cliques sur un bouton, c'est bien ça ?
Si oui, il est un peu dommage de faire tout ceci dans la mesure où DispatchAction (ou LookupDispatchAction) est fait pour ça...
Mais bon, au pire, je n'utilise pas la syntaxe $(...) mais tu pourrais t'inspirer de ceci

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
 
<html>
<head>
 
<script language="javascript">
 
function changeAction(actionVoulue, codeModification)
{
    var newURL = "<%=request.getContextPath()%>" + actionVoulue;
 
    document.forms[0].action = newURL;
    document.forms[0].modification.value = codeModification;
    document.forms[0].submit();
}
</script>
</head>
 
<body>
 
    <form action="http://www.ibm.fr/">
        <input type="hidden" name="modification">
 
        Champ 1 <input type="text" name="Champ1" value="Champ 1"/><br>
        Champ 2 <input type="text" name="Champ2" value="Champ 2"/><br>
        <br>
 
        <a onclick="javascript:changeAction('create.do', '0')">Ajouter</a>
        <a onclick="javascript:changeAction('update.do', '1')">Modifier</a>
    </form>
 
</body>
</html>

Merci merci.

Finalement en enlevant le bout de code :
Code:

1 2 3 4 5 tinyMCE.init({ mode : "textareas", language : "fr", });
ça fonctionne sur FF ET sur IE !!!

:king: