[DOM] Manipulation du Dom avec Checkbox
Bonjour,
je cherche à faire une petite manipulation de dom sur une page web, mais je ne vois pas par ou commencer. J'ai un tableau avec 3 colonne, sur chaque rangée la 3e cellule possede une checkbox. Le but ici étant de pouvoir manipuler les deux autres cellules en faisant un click sur un boutton quand la 3e colonne est cochée. Quel est la manip dom que je dois faire pour que mon evenement onclick fasse aparaitre par exemple un champ input dans les deux autres colonnes!
je met un bout de code histoire de visualiser ce que je cherche à faire:
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
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
| <form method="post" action="password/editpass"><table id="passwordsTable">
<tr>
<th>Mot de Passe</th>
<th>Validité</th>
<th>Sélectionner</th>
</tr>
<tr class="even">
<td>efrakata23</td>
<td> 17/04/2008 - 01/01/2010</td>
<td class="checkBox">
<input type="checkbox" name="passwordstodel[]" id="passwordstodel_efrakata23" value="efrakata23" /> </td>
</tr>
<tr class="odd">
<td>css2webdev</td>
<td> 21/04/2008 - 18/05/2008</td>
<td class="checkBox">
<input type="checkbox" name="passwordstodel[]" id="passwordstodel_css2webdev" value="css2webdev" /> </td>
</tr>
<tr class="even">
<td>barakobama</td>
<td> 21/04/2008 - 18/05/2008</td>
<td class="checkBox">
<input type="checkbox" name="passwordstodel[]" id="passwordstodel_barakobama" value="barakobama" /> </td>
</tr>
<tr class="odd">
<td>exuper</td>
<td> 21/04/2008 - 18/05/2008</td>
<td class="checkBox">
<input type="checkbox" name="passwordstodel[]" id="passwordstodel_exuper" value="exuper" /> </td>
</tr>
<tr id="pswCreation" class="even">
<td><input type="text" name="password" id="password" value="" /></td>
<td><input type="text" name="validitepsw" id="validitepsw" value="" /></td>
<td></td>
</tr>
<tr id="pswCreateButtons">
<td><input type="submit" name="commit" value="Ajouter" /></td>
<td><input value="Annuler" type="button" onclick="removeCreationButtons()"></td>
<td></td>
</tr>
</table>
<input id="ajoutMdp" value="Ajouter un mot de passe" type="button" onclick="displayCreationButtons()"><br /><br />
<input id="editMdp" value="Editer la sélection" type="button" onclick="displayEditionButtons()"><br /><br /><!-- je click sur boutton pour déclencher l'evenement qui va faire apparaitre les champ input dans les rangées sélection grace à la checkbox placée en 3e cellule!-->
<input type="submit" name="commit" value="Suprimer la sélection" id="suprMdp" /><br /><br />
</form> |
