[C#] code-behind : javascript

Version imprimable

Bonjour à tous,

J'ai du mal, dans des pages aspx à mettre du code-behind javascript.
Je voudrais, par exemple, au survol de la souris au dessus d'une image contenu dans un datalist, changer mon style.
J'ai donc fait cela:
Code:

1 2 3 4 5 6 7 8 <ItemTemplate>  <asp:Label ID="ID_PHOTOLabel" runat="server" Text='<%# Eval("ID_PHOTO") %>' Visible="false"></asp:Label><br /> <asp:Label ID="ID_ALBUMLabel" runat="server" Text='<%# Eval("ID_ALBUM") %>' Visible="false"></asp:Label><br /> <asp:Image ID="NAMELabel" runat="server" Text='<%# Eval("NAME") %>' Height='100px' Width ='<%# 100 %>' ImageUrl='<%# Eval("NAME") %>' ToolTip='<%# Eval("NAME") %>' onMouseOver="this.className='test';"></asp:Image><br />  <asp:Label ID="TAILLELabel" runat="server" Text='<%# Eval("TAILLE") %>' Visible="false"></asp:Label><br /> <br /> </ItemTemplate>
avec le stle test suivant:
Code:

1 2 3 4 5 6 7 test { background-color:Black; border:[solid][10px][#ff0000]; cursor:crosshair; }
Mais pas de changement !!

D'autre part, j'en profite car c'est le même sujet je pense !!
Comment récupérer l'id de l'image sélectionner, du côté client ...
un document.getElementByID() fonctionnerait bien mais je sais pas quoi mettre entre les parenthèses !!!!!! (vu que que je ne sais pas comment est générer l'id de mes images dans la datalist ...)

19/06/2006, 13h54
guitoux1

De mémoire mais j'en suis pas sur, je crois qu'il faut écrire :

Code:

onmouseover="this.style.classename='test'"

Citation:

un document.getElementByID() fonctionnerait bien mais je sais pas quoi mettre entre les parenthèses !!!!!!

Faut créer ton JavaScript xôté server avec Page.RegisterClientScriptBlock et ainsi tu ausra accès au bon ID (monControle.UniqueID)
19/06/2006, 14h20
aphykite
Je ne connais pas le javascript côté serveur, donc côté client, je ferais :
- soit tu passes l'id en paramètre, ce qui te donne :

Code:

onmouseover="test('NAMELabel');"

puis
Code:

1 2 3 4 5 test(champ) { ... }
- soit tu utilises event

Code:

onmouseover="test();"

et la fonction
Code:

1 2 3 4 5 6 test() { var idSrc = event.srcElement.id; document.getElementById(idSrc ).checked=true; }
Par contre, ce code ne fonctionne que sous IE ... il existe un équivalent pour les autres navigateurs, mais je ne le connais pas.

Guitoux,

J'ai fait ceci:
du côté serveur:
Code:

1 2 3 4 5 6 7 8 public void ImageClicked() { string script=""; script+=DataList1.UniqueID.ToString(); Page.RegisterClientScriptBlock("ID", script); }
Et du côté client:
Code:

1 2 3 <asp:Image ID="NAMELabel" runat="server" Text='<%# Eval("NAME") %>' Height='100px' Width ='<%# 100 %>' ImageUrl='<%# Eval("NAME") %>' ToolTip='<%# Eval("NAME") %>' onMouseOver="alert(<%#ImageClicked() %>)"></asp:Image><br />
Mais évidemment :? , ça ne marche pas ... :? :mouarf:

Est-ce que l'appel du côté client est bien fait ? Je crois que cela cloche.
Sinon, du côté serveur, c'est ça ?

19/06/2006, 14h28
guitoux1
okok, quand je disait "JavaScript côté server" je voulais dire écrire le code de ton javascript côté server, dans une string quoi. Ce qui donnerais pour par exemple une checkbox :
Code:

1 2 string js = "<script type=\"text/javascript\">alert('cochée ?' + document.getElementById('" + maCheckBox.UniqueID + "').checked);</script>" Page.RegisterClientScriptBock(js, this);
C'est de tête, ya peut-êter des petites erreurs :)

ok,
je dois plus être très loin du résultat:

Code:

1
2
3
4
5
6
7
8
 
    public void ImageClicked()
    {
        string script="";
        script+="<script language='javascript'>alert('"+DataList1.UniqueID.ToString()+"')</script>";
        Page.RegisterClientScriptBlock("ID", script.ToString());
 
    }

ça je pense que c'est bon.

Mais l'appelle de la fonction côté client est fause ...

Code:

1
2
3
 
 
<asp:Image ID="NAMELabel" runat="server" Text='<%# Eval("NAME") %>' Height='100px' Width ='<%# 100 %>' ImageUrl='<%# Eval("NAME") %>' ToolTip='<%# Eval("NAME") %>' onMouseOver="<%# ImageClicked() %>"></asp:Image>

si c'est une fonction, faut la créer en javascript :
Code:

1 2 3 4 5 6 public void ImageClicked() { string script=""; script+="<script language='javascript'>function tada() {alert('"+DataList1.UniqueID.ToString()+"');}</script>"; Page.RegisterClientScriptBlock("ID", script.ToString()); }
puis dans le code client :

Code:

<asp:Image ID="NAMELabel" runat="server" Text='<%# Eval("NAME") %>' Height='100px' Width ='<%# 100 %>' ImageUrl='<%# Eval("NAME") %>' ToolTip='<%# Eval("NAME") %>' onMouseOver="<%# tada() %>"></asp:Image>

:oops: désolé, je dois paraître long à la détente ...

côté serveur:

Code:

1
2
3
4
5
6
7
8
9
10
11
 
 
     public void ImageClicked()
    {
 
        string script = ""; 
        script += "<script language='javascript'>function tada() {alert('" + DataList1.UniqueID.ToString() + "');}</script>";
        Page.RegisterClientScriptBlock("ID", script.ToString()); 
 
 
    }

je me suis permis d'appeler ImageClicked dans la fonciton OnLoad côté serveur...

côté client:

Code:

1
2
3
4
 
 
 
<asp:Image ID="NAMELabel" runat="server" Text='<%# Eval("NAME") %>' Height='100px' Width ='<%# 100 %>' ImageUrl='<%# Eval("NAME") %>' ToolTip='<%# Eval("NAME") %>' onMouseOver="<%# tada() %>"></asp:Image><br />

Et l'erreur:

Code:

1
2
3
 
 
Erreur	1	Le nom 'tada' n'existe pas dans le contexte actuel	C:\Inetpub\wwwroot\MySite\album.aspx	36

19/06/2006, 15h02
guitoux1

a oui pardon, me suis planté, c'est :

Code:

<asp:Image ID="NAMELabel" runat="server" Text='<%# Eval("NAME") %>' Height='100px' Width ='<%# 100 %>' ImageUrl='<%# Eval("NAME") %>' ToolTip='<%# Eval("NAME") %>' onMouseOver="tada()"></asp:Image><br />

ce qui est logique vu ke tada est une fonction cliente

Ah ba oui, suis-je bête ...
Voilà ça marche maintenant, du moins l'appel de la fonction.

Il me reste un dernier souci...
Quand je clique sur l'image, j'appelle la fonction tada(), mais elle n'a pas l'air de me retrouner l'ID de l'item sur lequel j'ai cliqué.
Code:

1 2 3 4 5 6 7 8 9 10 11 12 public void ImageClicked() { string script = ""; script += "<script language='javascript'>function tada() {alert('" + DataList1.SelectedItem.UniqueID.ToString() + "');}</script>"; Page.RegisterClientScriptBlock("ID", script.ToString()); }
Datalist1.SelectedItem.UniqueID.ToStrin() me génère une erreur ...

a bah oui c sur, ca pourra pas marcher :(:(:

La création sdu Javascript ce fait avant celle du gridview, donc il n'as pas encore de ligne sélectionnée. De plus, avec cette méthode tu ne récupère l'id que d'une ligne !!

essaie alors ça :
Code:

1 2 3 4 5 6 7 8 9 10 public void ImageClicked() { string script = ""; script += "<script language='javascript'>function tada(monID) {alert('" + DataList1.UniqueID.ToString() + "_' + monID);}</script>"; Page.RegisterClientScriptBlock("ID", script.ToString()); }
je suis pas certain de _ mais je crois que c'est ça

et dans la page aspx :
Code:

1 2 <asp:Image ID="NAMELabel" runat="server" Text='<%# Eval("NAME") %>' Height='100px' Width ='<%# 100 %>' ImageUrl='<%# Eval("NAME") %>' ToolTip='<%# Eval("NAME") %>' onMouseOver="tada(this.id)"></asp:Image><br />
Je suis pas certain du this.id, mais bon je crois que c'est ça

19/06/2006, 15h42
LE NEINDRE

Super !!
ça marche !! du premier coups !!!
Meric beaucoup Guitoux !

je vais maintenant m'atteler à récupérer le chemin de l'image cliquée .....

!!!

Merci encore ;)
19/06/2006, 16h00
LE NEINDRE

oups j'ai peut-être crié victoire un peu trop vite :oops:

Le résultat afficher par la boite de dialogue alert() me donne:

Citation:

DataList1_DataList1_ctl02_NAMELabel

or le véritable ID de la case cliquée est:

Citation:

DataList1_ctl02_NAMELabel

mmmm bizarre ...
19/06/2006, 16h09
LE NEINDRE
Ah ba oui mais c'est mon en fait !!!
Code:

1 2 3 4 script += "<script language='javascript'>function tada(monID) {alert(monID);}</script>";
Et en fait, je dois pouvoir le faire directement ....
19/06/2006, 16h10
guitoux1

effectivement, c'est bizare ça. vérifie bien ton code... :)
19/06/2006, 16h12
guitoux1

et oui j'suis con moi !! effectivemen,t en faisant onmouseover="tada(this.id)" t'as directement le BON id !! putain c fou ce con peu passer à coté de truc évidents quand on regarde pas au bon endroit !!

dsl pour tout ce foutoir, la solution été si simple !!!
19/06/2006, 16h15
LE NEINDRE

Bah au moins, grâce à toi, j'ai vu qu'on pouvait générer du script client côté serveur avec Page.RegisterClientScriptBlock qui me servira très probablement plus tard ! :D

Donc merci et je t'en prie ne t'excuse pas, franchement tu m'aides trop !!! ;)