Discussion :

[PatStan17]

Bonjour

J'ai un gridView que je paramètre en interacitf dans le code behind ...

Dans ce gridview j'ai un ImageField

Dans l’événement RowDataBound de ce gridview
j'ajoute ces deux fonctions Javascript sur mon ImageField :

Code :

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

1
2
3
4
5
6
7
8
9
 if (Lgn.RowType == DataControlRowType.DataRow)
{
 
                string ClientID = Lgn.Cells[1].Controls[0].ClientID;
 
 
                Lgn.Cells[1].Attributes.Add("onmouseover", "MontrePhoto(" + ClientID + ")");
                Lgn.Cells[1].Attributes.Add("onmouseout", "CachePhoto()");
}

voici mes deux fonctions javascript :

Code JavaScript :

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
23
24
25
26
27
 function MontrePhoto(IdImg)
        {           
            var Image = document.getElementById(IdImg);        
 
            var Chemin = Image.getAttribute("src");
            var x = event.clientX;
            var y = event.clientY;
 
            var LeCadre = document.getElementById('DivCadrePhotoPersonnel');
 
            LeCadre.style.display = "block";
 
            document.getElementById('PhotoPersonnel').setAttribute("src", Chemin);
            document.getElementById('PhotoPersonnel').CssClass = "ImgRonde70Px";
 
            LeCadre.style.position = 'absolute';
            LeCadre.style.left = (x + 150) + 'px';
            LeCadre.style.top = y - 50 + 'px';
 
            document.getElementById('PhotoPersonnel').CssClass = "ImgRonde70Px";
 
        }
 
        function CachePhoto()
        {
            document.getElementById('DivCadrePhotoPersonnel').style.display = "none";
        }

L'objectif de tous ça et que quand mon utilisateur passe sa souris sur une photo en miniature (40px)
dans le gridview elle apparaisse en grand à coté du curseur de la souris ...

Quand j'utilise ces fonctions javascript sur des miniatures dans un tableau HTML ou autre cela fonctionne très bien.

Quand j'essaye de les mettre en oeuvre dans un gridview qui se rempli à partir d'une BD et construit dynamiquement ça ne marche pas ...

Quand je lance et que je regarde le débogueur de chrome j'ai ces messages :

Uncaught TypeError: Cannot read property 'getAttribute' of null

at MontrePhoto (GestionGroupeDeNiveau:55)
at HTMLTableCellElement.onmouseover (GestionGroupeDeNiveau:241)

Je précise que j'ai testé la valeur qui est envoyée à ma fonction MontrePhoto et elle correspond bien au ClientID du contrôle de
mon gridview ou j'ai passé ma souris.


Cela fait comme si document.getElementById(IdImg) ne renvoi rien ...


J’espère avoir été clair ...
Quelqu'un peut 'il me dépanner ?

[DotNetMatt]

Je suppose que tu es en ASP.NET WebForms. Comment est-ce que tu definis la valeur du parametre IdImg pour la function MontrePhoto ? Est-ce qu'elle contient le bon ID ?

Au runtime les IDs sont generes automatiquement par defaut. Il faut utiliser la propriete ClientId pour avoir le bon. Par exemple :

Code Javascript :

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

1
2
var imageId = '<%= Image.ClientID %>';
var img = document.getElementById(imageId);