Discussion :

[zooffy]

Bonjour

Je suis confronté à un souci un peu empirique. Je dois faire un bloc accordéon, un truc avec un petite image en forme de croix sur laquelle on clique pour afficher un bloc en dessous et si on reclique, le bloc se referme.

Si j'étais en ASP 3.0, je le ferais avec du JScript sans souci. Mais là, en .NET je ne sais pas trop par où commencer et encore moins comment mettre une fonction JScript sur le click d'une image.

Voici le code de ma page côté HTML :

Code :

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

1
2
3
4
5
6
7
8
9
10
 
<asp:Image ID="imgCroix" runat="server" />
<asp:Label ID="lblTitre" runat="server"></asp:Label>
<asp:Table ID="tblGolbale" runat="server">
	<asp:TableRow>
		<asp:TableCell>
			<asp:Label ID="lblTexteBase" runat="server" Text="j'affiche pour le test"></asp:Label>
		</asp:TableCell>
	</asp:TableRow>
</asp:Table>

L'idée est de cliquer sur l'image pour afficher la Table ou pas. Le label titre doit toujours rester visible. Tout cela est dans un Composant Utilisateur.

Pouvez vous m'aiguiller sur le bon chemin ?

[Promesses]

Il est possible de faire dans ton code:

Code :

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

1
2
 
imgCroix.Attributes.add("onclick","functionJs()")

Ensuite on peut admettre que tu as script soit dans ta page soit dans un .js

Il est aussi possible d'écrire ton script et de l'enregistrer sur ta page de cette manière:

Code :

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

1
2
 
Me.Page.ClientScript.RegisterClientScriptBlock(Me.GetType, "monScript", "<script type='text/javascript'>" & str & "</script>")

str étant ta fonction, ton script ce que tu veux ...

[zooffy]

Merci pour ton aide.

J'ai choisi la première option, qui me parait plus simple.

Je butte sur une conséquence que je n'avais pas envisagée au départ. Vu que je vais avoir plusieurs blocs sur ma page, je n'arrive pas à les identifier séparément parce que je ne vois pas comment je peut intervenir sur mon DIV à la construction de la page.

Voici le code modifié :

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
 
<script type="text/javascript">
function ouvrir() {
if (document.getElementById("accordeon").style.display == "none") {
	document.getElementById("accordeon").style.display = "block";
}
else {
	document.getElementById("accordeon").style.display = "none";
}
}
</script>
<asp:Image ID="imgCroix" runat="server" />
<asp:Label ID="lblTitre" runat="server"></asp:Label>
<div id="accordeon" style="display:none;">
<asp:Table ID="tblGlobale" runat="server">
	<asp:TableRow>
		<asp:TableCell>
			<asp:Label ID="lblTexteBase" runat="server" Text="j'affiche pour le test"></asp:Label>
		</asp:TableCell>
	</asp:TableRow>
</asp:Table>
</div>

J'ai encadré la Table avec le DIV pour le piloter.

Mais peut être qu'il y a une autre solution

[zooffy]

Bon, j'ai avancé un poil. J'ai viré mon DIV et j'agis directement sur la table

Mais je rencontre toujours ce souci de l'identifiant unique. Je ne comprends pas comment deux contrôles peuvent avoir le mêm identifiant dans la page.

J'ai fait un truc comme ça dans mon CodeBehind :

Code :

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

1
2
 
imgCroix.Attributes.Add("onclick", "ouvrir('" & tblGlobale.ClientID & "');")

Mais vu que mes deux tables ont le même identifiant, ben ça merdouille sévère.

Une idée ?

[lutecefalco]

tblGlobal.UniqueID peut être

[zooffy]

Pas mieu, j'ai essayé aussi, mais ça marche pas non plus.
et en plus, le clienId et le Unique Id sont ReadOnly, donc même pas possible de les affecter.