J'essaie de comprendre comment faire cela, mais je ne peux pas le trouver. Fondamentalement, je veux pouvoir cliquer n'importe où sur une ligne de table et vérifiera la case à cocher / décochera la case à cocher. Je sais que c'est possible parce que c'est ce que phpmyadmin ...
Voici ma ligne de table P>
<tbody> <tr id="1" onclick="selectRow(1)"><td width="20px"><input type="checkbox" id="1" name="1/"></td><td>1</td><td>2011-04-21 22:04:56</td><td>action</td></tr> <tr id="2" onclick="selectRow(2)"><td width="20px"><input type="checkbox" id="2" name="2/"></td><td>2</td><td>2011-04-21 22:04:56</td><td>action</td></tr> </tbody>
4 Réponses :
<table>
<tbody>
<tr>
<td>
<input type="checkbox" id="chk1" name="chk1" />
</td>
<td>1</td>
<td>2011-04-21 22:04:56</td>
<td>action</td>
</tr>
<tr>
<td>
<input type="checkbox" id="chk2" name="chk2" />
</td>
<td>2</td>
<td>2011-04-21 22:04:56</td>
<td>action</td>
</tr>
<tr>
<td>
<input type="checkbox" id="chk2" name="chk3" />
</td>
<td>2</td>
<td>2011-04-21 25:30:16</td>
<td>action</td>
</tr>
</tbody>
</table>
Juste une note à propos de l'utilisation de cela, c'est que votre case à cocher doit toujours être la première entrée de la ligne de table.
... et notez que cela ne sera défini que sur "vrai"; Vous voudrez ajouter une certaine logique pour vous assurer qu'elle se tournera vers «False» si nécessaire, voir ma réponse ci-dessous.
@Saint Votre édition est inutile, firstinput.checked =! firstInput.Checked; Inverse déjà l'état vérifié de la case, mais le fait dans une ligne au lieu de votre édition qui utilise dix.
@canon quand je clique sur la case à cocher, il ne modifie pas son état. Des conseils comment résoudre ce problème?
Comment vérifier une autre autre ligne lorsque vous cliquez sur une ligne? J'ai besoin de vérifier une ligne à la fois, si je vérifiais une autre rangée ancienne, une autre rangée est allé à False, comment le faire dans ce code?
Essayez celui-ci ...
JQuery (1.6+): $ ("TR"). Cliquez sur (Fonction () {VAR Cochez la case = $ (ceci) .Find ("Entrée [Type = 'Cochez la case']"); case à cocher.prop ("coché",! Case à cocher.Prop ("coché"));});
Vous n'avez pas besoin de JavaScript pour cela:
p>
<td width="20px"><input type="checkbox" id="chk2" name="chk2/"></td><td><label for="chk2">2</label></td><td><label for="chk2">2011-04-21 22:04:56</label></td><td><label for="chk2">action</label></td>
Bonjour - Pourquoi avons-nous besoin de bloc d'affichage TD? Et pouvons-nous simplement appliquer une étiquette à la rangée de la table? Grande solution globale
Par défaut, une étiquette est juste un élément en ligne, ce qui signifie qu'il s'agit simplement de la taille du texte qu'il contient. En ce qui concerne un élément de bloc augmente la taille de la zone cliquable sur la cellule de la table entière.
Et non, vous ne pouvez pas simplement envelopper l'étiquette autour de la ligne, cela créera un HTML invalide.
Merci pour le conseil!
Cela devrait être marqué comme la bonne réponse. Pour moi, JavaScript est toujours une mesure du dernier recours. Personnellement, j'allage de toutes mes cases à cocher à l'intérieur d'une étiquette avec l'affichage sur le blocage, bien que cela augmente la taille (en octets) de ma page tenant la table, alors je vous réchauffe jusqu'à votre approche, je veux juste être à la preuve future mon Travailler, sur le hors-chance qu'un jour, une nouvelle table i construit ne rendra pas étrangement parce que j'ai oublié que toutes les étiquettes ont ce CSS attaché.
Étant donné que cette question obtienne tant de points de vue et la réponse acceptée a un petit problème.
Le problème est lorsque vous cliquez sur la case à cocher Cela ne changera pas. En fait, ce qui se passe est la case à cocher Toggle deux fois. En raison de nous avons cliqué sur la case à cocher et la ligne de table également. Donc, voici une solution appropriée avec un correctif. bonne chance devs.