recuperer la ligne cliquée sous Firefox

Version imprimable

Bonjour a tous !
voila mon problème...
soit la fonction ci-dessous :
[i]
Code:

1 2 3 4 5 6 7 8 9 10 11 12 function GetRows() { source=ns6? source.parentNode : source.parentElement var rows = document.getElementById('TABLE1').getElementsByTagName('tbody')[0].getElementsByTagName('tr'); for (i = 0; i < rows.length; i++) { rows.onclick = function(){ alert (this.rowIndex + 1)// valeur a remonter } } //return ???// ici je ne sais plus quoi faire !:cry: }
cette fonction est chargée de m'afficher le N° de la ligne cliquée d'un table ( ici 'TABLE1'). jusque la cela marche sans problème.

QUESTION : comment faire pour renvoyer la valeur de this.rowIndex+1 au niveau de la fonction GetRows()?

merci d'avance pour vos réponses eclairées !:D
bon dev's !!!

22/07/2006, 23h48
troumad

Salut Guy

Je suis surpris par ton programme (déjà, j'apprends le rowIndex).
Ensuite, pour moi, ta fonction (que j'aimerai tester) fait que lorsque tu cliques sur une case du tableau, une fonction va s'exécuter.

Je mettrais un alert avant ton return pour voir si ta fonction s'exécute bien quand tu le souhaites.

Pour palier à ce problème, je ferais exécuter une routine à ton programme qui elle fera ce que tu souhaites en passant le paramètre this.rowIndex

bof, y'a pas a etre surpris...
tiens voici le source complet...

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
html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Detecting table row index with JavaScript</title>
<style type="text/css">
body { width: 500px; text-align: center; font: bold 10px/16px Verdana, sans-serif; color: #555; margin: 20px auto; }
h1, p { text-align: left; font-weight: normal; }
h1 { font: bold 14px "Trebuchet MS", sans-serif; color: #600; }
table { width: 500px; margin: 0 auto; font-size: 10px; border: 1px solid #ccc; border-width: 1px 0 0 1px; border-collapse: collapse; }
caption { margin: 0 auto; font-size: 12px; margin-bottom: 2em; }
td { padding: 10px; border: 1px solid #ccc; border-width: 0 1px 1px 0; }
tr:hover td { background: #CAEFFD; color: #0768B3; cursor: pointer; }
</style>
 
<script type="text/javascript">
onload = function() {
    if (!document.getElementsByTagName || !document.createTextNode) return;
    var rows = document.getElementById('table1').getElementsByTagName('tbody')[0].getElementsByTagName('tr');
    for (i = 0; i < rows.length; i++) {
        rows[i].onclick = function() {
            alert(this.rowIndex + 1);
        }
    }
}
</script>
</head>
<body>
<table id="table1">
<tbody>
    <tr><td>first row</td><td>first row</td><td>first row</td><td>first row</td></tr>
    <tr><td>second row</td><td>second row</td><td>second row</td><td>second row</td></tr>
    <tr><td>third row</td><td>third row</td><td>third row</td><td>third row</td></tr>
    <tr><td>fourth row</td><td>fourth row</td><td>fourth row</td><td>fourth row</td></tr>
</tbody>
</table>
 
<br /><br />
 
<body>
</html>

1) je ne m'appelle pas Guy...:cry:
2) tu verras cela marche...
le seul probleme c'est pour faire remonter l'info...
3) tu verras que j'ai déja placé un alert pour tester...
4) merci pour ta reponse !... je vais voir cela de plus pres !:D
bon dev's...:D
@+++

J'avais bien raison ! Il faut remplacer ton alert par une fonction avec comme paramètre la ligne cliquée.

Comme je n'ai pas trouvé de colIndex, j'ai fais ce script qui donne les coordonnées de la case quand on clique dessus. Il suffit juste de le mettre à la place du tient ;)

Code:

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">
onload = function() {
    if (!document.getElementsByTagName || !document.createTextNode) return;
    var rows = document.getElementById('table1').getElementsByTagName('tbody')[0].getElementsByTagName('tr');
    for (i = 0; i < rows.length; i++)
    {
     var col=rows[i].getElementsByTagName('td')
     for (j = 0; j < col.length; j++)
     {
      col[j].name="ligne : "+(i+1)+" ,colonne : "+(j+1)
      col[j].onclick = function()
      {
       alert(this.name)
      }
     }
//        rows[i].onclick = function()
//        {
//            (this.rowIndex + 1);
//        }
    }
}
</script>

Merci de ta réponse !
mais il ne s'agit pas de renvoyer les coordonnées de la case quand on clique dessus.

si tu reprend la demande d'origine :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 function GetRows() { source=ns6? source.parentNode : source.parentElement var rows = document.getElementById('TABLE1').getElementsByTagName('tbody')[0].getElementsByTagName('tr'); for (i = 0; i < rows.length; i++) { rows.onclick = function(){ alert (this.rowIndex + 1)// valeur a remonter } } //return ???// ici je ne sais plus quoi faire !:cry: }
je voudrais faire remonter this.rowindex au niveau de GetRows ! pour faire un truc du style X=GetRows(); alert(X); x contenant this.rowIndex...
comme l'evenement onclick est lie a une fonction , je ne sais pas faire remonter l'info au niveau de la fonction principale
voila !
mais merci encore de ta réponse !:D
@+++