getElementById qui ne marche pas

Version imprimable

22/04/2010, 18h02
ChTiRiBi

getElementById qui ne marche pas
Bonsoir, j'ai une page index.xhtml qui contient 4 boutons, je veux qu'à chaque fois que je clique sur un de ces boutons, l'image de la bannière change selon le bouton, ainsi chaque bouton a sa propre image qui lui ai associé dans la bannière.
J'ai fait une fonction javascript que voici:
Code:

1 2 3 4 5 function changeImg(){ alert ('bouton clique1'); document.getElementById("ban").value = "/img/banner1.gif"; alert ('bouton clique2'); }
voici le code d'un des bouton:

Code:

<div class="bt1"><s:link><h:graphicImage border="0" alt="epave" value="/img/bt-epave.gif" onclick="changeImg()"></h:graphicImage></s:link></div>

mon problème est que quand je clique sur le bouton l'image ne change pas, j'ai les 2 alertes qui s'affichent donc le problème vient surement de mon getElementById mais je vois vraiment pas ou?.
Merci d'avance pour votre aide.
22/04/2010, 18h26
Michelk12

Bonjour,

Je te conseil d'afficher ta page index.html et de cliquer-droit afin d'afficher le code source de celle-ci.
En recherchant dans ce code, retrouve l'emplacement de ton "ban" et ainsi tu vois la valeur de l'ID.

Est-ce ID="ban" ou autre chose ?

Michel
22/04/2010, 18h46
ChTiRiBi

c'est bien id="ban" dans le code généré de la page
22/04/2010, 18h54
Michelk12

Au fait, c'est pour une image?

Ce n'est pas

Code:

document.getElementById("ban").src = "/img/banner1.gif";

Ce serait mieux de mettre un chemin relatif, par exemple :

Code:

document.getElementById("ban").src = "./img/banner1.gif";

Si ce n'est pas cela, je laisse à d'autres...

Michel
22/04/2010, 18h58
ChTiRiBi

oui c'est bien sa, mais j'ai un nouveau problème maintenant, l'image change mais quand je clique sur OK du 2ém pop-up l'ancienne image revient
22/04/2010, 19h07
Michelk12

La deuxième popup... ha oui le 2ème alert!

Tu ne pourrais pas me faire parvenir ton fichier?
Sinon que se passe-t-il au retour de la procédure?
Quelque chose est-il rechargé?

Bon voila le code de mon fichier:

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
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:s="http://jboss.com/products/seam/taglib"
	xmlns:rich="http://richfaces.org/rich"
	xmlns:a="http://richfaces.org/a4j">
<script language="javascript">
function changeImg(){
 
	document.getElementById("ban").src="./img/banner1.gif";
 
}
	</script>
 
	<div id="header-top">
		<div class="langDate">
			<div class="anglais"><h:graphicImage value="/img/flag-en.gif" /><s:link>English</s:link></div>
			<div class="separateur"><h:graphicImage value="/img/sep.jpg" alt="separateur" style=" width : 2px;" /></div>
			<div class="arabe"><h:graphicImage value="/img/flag-tn.gif" /><s:link>عربي</s:link></div>
			<div class="dateCol">
				Mardi 25 Mars 2008 / 10:17 
			</div>
		</div>
 
	<div class="logo"><s:link action="#"><h:graphicImage value="/img/logo.jpg" border="0" /></s:link></div>
	<div class="banner">
		<div class="banner-arrondie"> </div>
		<h:graphicImage value="/img/banner1.jpg" alt="banner" id="ban" /></div>
	<div class="lien-top">
		<div class="bt"><s:link view="/index.xhtml"><h:graphicImage value="/img/bt-acc.gif" border="0" alt="accueil"  /></s:link></div>
		<div class="bt"><s:link><h:graphicImage border="0" alt="contact" value="/img/bt-contact.gif"/></s:link></div>
		<div class="liens">
			<div class="bt1"><s:link><h:graphicImage border="0" alt="epave" value="/img/bt-epave.gif" onclick="changeImg()"></h:graphicImage></s:link></div>
			<div class="bt1"><s:link><h:graphicImage border="0" alt="mer" value="/img/bt-mer.gif"/></s:link></div>
			<div class="bt1"><s:link><h:graphicImage border="0" alt="flotte" value="/img/bt-flotte.gif"/></s:link></div>
			<div class="bt1"><s:link><h:graphicImage border="0" alt="securite" value="/img/bt-securite.gif"/></s:link></div>
		</div>
	</div>
	</div>
</ui:composition>

notez que j'ai enlevé les 2 alert dans la fonction javascript

23/04/2010, 07h55
vermine
Bonjour,

Ca veut dire quoi ceci ?
Code:

1 2 <s:link></s:link>
Ca recharge la page ? Si oui, alors c'est normal qu'on obtienne l'image par défaut.
23/04/2010, 08h31
Michelk12

Hello Vermine

Cela me fait penser à une page générée par un outil à la sauce Joomla. :)

Michel
26/04/2010, 10h29
ChTiRiBi
Citation:
Envoyé par vermine

Bonjour,

Ca veut dire quoi ceci ?

Code:

1 2 <s:link></s:link>

Ca recharge la page ? Si oui, alors c'est normal qu'on obtienne l'image par défaut.
non sa ne recharge pas la page c'est équivalant à la balise <a>
27/04/2010, 14h27
Matthieu2000

http://www.roseindia.net/jsf/graphicImage.shtml

regarde le code html généré!
27/04/2010, 15h07
SpaceFrog

encore faut il pouvoir charger la page...
y'a une enfilade de balises link par fermées .....
27/04/2010, 15h15
vermine

To Delete

Non, non, Space Frog, elles sont toutes fermées. Ne te fais pas avoir par les couleurs. ;)

de mon coté j'ai ça :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<html>
<head>
<link href="" id="aepref-styles.css.tables.enabled">
<link href="" id="aepref-styles.author.css.enabled">
<link href="" id="aepref-styles.css.tags.enabled">
<link href="" id="aepref-styles.css.tables.enabled">
<link href="" id="aepref-styles.author.css.enabled">
<link href="" id="aepref-styles.css.tags.enabled">
<link href="" id="aepref-styles.css.tables.enabled">
<link href="" id="aepref-styles.author.css.enabled">
<link href="" id="aepref-styles.css.tags.enabled">
<link href="" id="aepref-styles.css.tables.enabled">
<link href="" id="aepref-styles.author.css.enabled">
<link href="" id="aepref-styles.css.tags.enabled">
</head>
<body>
</body>
</html>

je ne vois aucune balise link fermée ...

27/04/2010, 15h19
Matthieu2000
Citation:
Envoyé par vermine

Bonjour,

Ca veut dire quoi ceci ?

Code:

1 2 <s:link></s:link>

Ca recharge la page ? Si oui, alors c'est normal qu'on obtienne l'image par défaut.
Code:

xmlns:s="http://jboss.com/products/seam/taglib"

c'est le code source côté serveur!
27/04/2010, 15h22
vermine

Han d'accord, au temps pour moi, je n'ai pas regardé cette page. :oops:

Fais chaud, hein ? :oops:
28/04/2010, 11h08
ChTiRiBi

heeu quelqu'un sait pourquoi sa me remet l'ancienne image? et comment y remédier? :aie:
28/04/2010, 11h34
SpaceFrog

rechargement de page = pertes des données javascript, réinitialisation de page
28/04/2010, 11h51
ChTiRiBi

mais je n'ai pas mis de commande qui recharge la page :calim2:
28/04/2010, 11h54
SpaceFrog

ben un link recharge la page non ?
28/04/2010, 11h56
vermine
Citation:
Envoyé par vermine

Bonjour,

Ca veut dire quoi ceci ?

Code:

1 2 <s:link></s:link>

Ca recharge la page ? Si oui, alors c'est normal qu'on obtienne l'image par défaut.
C'est ce que je pensais aussi, mais si le href="#", est-ce que ça recharge la page quand même ?
28/04/2010, 12h19
ChTiRiBi

non je ne pense pas, je croit plutôt que c'est le <h:graphicImage.....>.
Il y a une solution pour y remédier?
28/04/2010, 12h22
ChTiRiBi

Citation:

Envoyé par vermine

C'est ce que je pensais aussi, mais si le href="#", est-ce que ça recharge la page quand même ?

pour que href="#" recharge la page il faut y cliquer non? or dans notre cas ce n'est pas le bouton cliqué
28/04/2010, 12h58
SpaceFrog

je pense plus simplement que tu n'est pas dans le bon forum

clairement <x: ...> n'est pas du javascript ça se passe coté serveur
28/04/2010, 13h01
ChTiRiBi

oui mais au début c'était du javascript, enfin c'est ce que je pensais. Bon on déplace la discussion comment déjà? :mrgreen:
28/04/2010, 13h06
Matthieu2000

La plupart de tes images, tu les mets dans des liens hypertext

Code:

<s:link></s:link>

qui sont totalement inutile!

pour récupérer les codes html généré, il suffit de faire un "affiche source" ! Les codes jsf sont inutile sur ce forum!
28/04/2010, 13h21
ChTiRiBi

Citation:

Envoyé par Matthieu2000

qui sont totalement inutile!

inutile pour faire quoi?
si c'est pour me dire que ce n'est pas le bon forum, SpaceFrog l'a déjà dit
28/04/2010, 13h32
vermine

Inutile pour qu'on puisse trouver la source du problème. ;)
Si la cause vient du Javascript, nous il nous faut uniquement le code généré. Sinon alors oui, ça viendra du langage serveur.
28/04/2010, 13h35
ChTiRiBi

ok merci :D
je vais creusé coté serveur alors..