Récupérer dans un <td>

**DoumCSS** · 16/04/2012, 03h01

Bonjour à tous!
J'ai un petit problème...

J'ai un calendrier que je fais afficher et sur le clic dans une cellule (<td>), dans laquelle se trouve une date (ex.: 18) je veux faire apparaître ce chiffre dans un <input> que je mettrai en "type=hidden" afin de récupérer, entre autres, cette valeur pour insertion dans une bdd.

Cependant, cela ne me retourne que le chiffre "1", peu importe la case dans laquelle je clique... Avant, ça me retournait toujours "[object]" mais j'ai ajouté .innerHTML ou .innerText et là, ca me retourne toujours "1"...

Bref, voici quelques lignes de code...

Fonction pour ajouter le texte

Code :

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

1
2
3
4
5
<script language="JavaScript">
function add_it(){ 
   document.cal.jour.value = document.getElementById("day").innerText;
}
</script>

Dans mon tableau (<table>), mon "echo" va ainsi:

Code :

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

1
2
3
echo "<td valign=top width=50 height=50 id=day bgcolor=#cccccc 
onClick=\"javascript: style.backgroundColor='#cc0000'; style.Color='#ffffff'; add_it();\" 
onBlur=\"style.backgroundColor='#cccccc'; style.Color='#000000';\">".$dayArray['mday']."</td>\n";

Et évidemment, j'ai dessous, mon input qui a comme name="jour"

Code :

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

<input type="text" name="jour" readonly>

Alors là, j'ai vraiment pas mis bcp de code mais j'espère que vous pourrez m'éclairer sur le pourquoi du "1" qui m'est toujours retourné!!!

**MaitreKaio** · 16/04/2012, 07h32

J'aimerais assez voir la tête du HTML généré pour le calendrier, c'est possible ?

**andry.aime** · 16/04/2012, 07h36

Bonjour,

1- Tu dois mettre les valeurs des attributs dans des quotes.
2- Le code html généré nous sera plus utile que ton code php.
3- J'imagine que tu as plusieurs fois l'id "day".

A+.

**DoumCSS** · 16/04/2012, 12h01

Bonjour et merci de vous intéresser à ce sujet!

La page est ici:
http://www.zonevolley.com/calendrier.php

Et, évidemment, tous les <td> ont comme id "day".

**DoumCSS** · 16/04/2012, 12h06

Et je peux toujours vous mettre le code complet...

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
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
 
define("ADAY", (60*60*24));
$thisYear = date('Y');
 
if ((!isset($_POST['month'])) || (!isset($_POST['year']))) {
	$nowArray = getdate();
	$month = $nowArray['mon'];
	$year = $nowArray['year'];
} else {
	$month = $_POST['month'];
	$year = $_POST['year'];
}
$start = mktime(12,0,0,$month,1,$year);
$firstDayArray = getdate($start);
?>
 
<html>
<head>
<title><?php echo "Calendar: ".$firstDayArray['month']."" . $firstDayArray['year']; ?></title>
 
<script language="JavaScript">
function add_it(){ 
   document.cal.jour.value = document.getElementById("day").innerText;
}
</script>
 
</head>
<script type="text/javascript">
function eventWindow(url){
	event_popupWin = window.open(url, 'event', 'resizable=yes, scrollbars=yes, toolbar=no,width=400,height=400');
	event_popupWin.opener = self;
}
</script>
<body>
<h1>Choix de la Date</h1>
<form name="cal" method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>">
<select name="month">
<?php
$months = Array("Janvier", "Février", "Mars", "Avril", "Mai", "Juin", "Juillet", "Août", "Septembre", "Octobre", "Novembre", "Décembre");
 
for ($x=1; $x<=count($months); $x++){
        echo "<option value=\"$x\"";
        if ($x == $month){
                echo " selected";
        }
        echo ">".$months[$x-1]."</option>";
}
?>
</select>
<select name="year"> 
<?php 
for ($x=$thisYear; $x<=$thisYear + 1; $x++){ 
        echo "<option"; 
        if ($x == $year){ 
                echo " selected"; 
        } 
        echo ">$x</option>"; 
}
?>
</select>
<input type="submit" name="submit" value="Afficher le mois choisi">
 
<br />
<?php
$days = Array("Dim", "Lun", "Mar", "Mer", "Jeu", "Ven", "Sam");
echo "<table border=\"1\" cellpadding=\"3\"><tr>\n";
foreach ($days as $day){
        echo "<td style=\"background-color: #aeaeae; text-align: center; width: 14% \"><strong>$day</strong></td>\n";
}
for ($count=0; $count < (6*7); $count++){
        $dayArray = getdate($start);
        if (($count % 7) == 0){
                if ($dayArray['mon'] != $month){
                        break;
                } else {
                        echo "</tr><tr bgcolor=#cccccc>\n";
                }
        }
        if ($count < $firstDayArray['wday'] || $dayArray['mon'] != $month){
                echo "<td>&nbsp;</td>\n";
        } else {
                                echo "<td valign=top width=50 height=50 id=day bgcolor=#cccccc onClick=\"javascript: style.backgroundColor='#cc0000'; style.Color='#ffffff'; add_it();\" onBlur=\"style.backgroundColor='#cccccc'; style.Color='#000000';\">".$dayArray['mday']."</td>\n";
                $start += ADAY;
        }
}
echo "</tr></table>";
?>
<input type="text" name="jour" readonly>
</form>
</body>
</html>

**andry.aime** · 16/04/2012, 12h12

Envoyé par DoumCSS

Et, évidemment, tous les <td> ont comme id "day".

C'est ce qu'il ne faut pas faire. Un id doit être unique. Concatène ton id avec le numéro de ligne pendant la génération de la page et tu passes ensuite cette numéro en paramètre de la fonction js.

A+.

**DoumCSS** · 16/04/2012, 12h24

D'accord mais dans ma fonction js, je fais comment?

Code :

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

1
2
3
4
5
<script language="JavaScript">
function add_it(){ 
   document.cal.jour.value = document.getElementById("day").innerText;
}
</script>

Je pourrais faire référence à l'élément cliqué du genre qu'à la place de:
document.getElementById("day").innerText
je mette autre chose du genre:
document.click ... ou je ne sais trop??? lol

**andry.aime** · 16/04/2012, 12h44

Envoyé par andry.aime

tu passes ensuite cette numéro en paramètre de la fonction js.

Code :

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

function add_it(numLigne)...

**DoumCSS** · 16/04/2012, 22h12

Hum... Pour le php, je réussis bien mais pour donner les différents numéros dans le js, je vois pas comment... :/

Comme tu peux voir, j'ai réussi à nommer chaque "id" différemment:

Code :

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

1
2
3
4
<td valign=top width=50 height=50 id=day1 bgcolor=#cccccc onClick="javascript: style.backgroundColor='#cc0000'; style.Color='#ffffff'; add_it();" onBlur="style.backgroundColor='#cccccc'; style.Color='#000000';">1</td>
<td valign=top width=50 height=50 id=day2 bgcolor=#cccccc onClick="javascript: style.backgroundColor='#cc0000'; style.Color='#ffffff'; add_it();" onBlur="style.backgroundColor='#cccccc'; style.Color='#000000';">2</td>
<td valign=top width=50 height=50 id=day3 bgcolor=#cccccc onClick="javascript: style.backgroundColor='#cc0000'; style.Color='#ffffff'; add_it();" onBlur="style.backgroundColor='#cccccc'; style.Color='#000000';">3</td>
<td valign=top width=50 height=50 id=day4 bgcolor=#cccccc onClick="javascript: style.backgroundColor='#cc0000'; style.Color='#ffffff'; add_it();" onBlur="style.backgroundColor='#cccccc'; style.Color='#000000';">4</td>

... Et ainsi de suite... Mais pour le add_it()... ???

**DoumCSS** · 16/04/2012, 22h30

Bon et bien en cherchant un peu, j'ai pu trouver ce que je devais faire. Alors pour ceux à qui ça pourrait servir:

Ma fonction add_it:

Code :

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

1
2
3
4
5
<script language="JavaScript">
function add_it(clicked_id){ 
   document.cal.jour.value = clicked_id;
}
</script>

Et pour chaque <td> les "id" se forment comme suit:

Code :

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

<td id=".$dayArray['mday']." onClick=\"javascript: add_it(this.id);>".$dayArray['mday']."</td>

Et voilà, le tour est joué!

Merci andry.aime !!

Récupérer dans un <td>

JavaScript

Discussions similaires

Partager

Partager