2010-11-19 14 views
0

Je pense que c'est un problème assez simple.jQuery Selector

J'ai une grande table. Dans chaque rangée il y a deux cases à cocher. Si un est coché, je veux aussi changer l'attribut de l'autre case dans la même ligne pour cocher.

My Code on Paste Bin

<script language="javascript" type="text/javascript"> 
$(document).ready(function(){ 
$(".BookTable input[name=attended]").click(function() { 

    if ($(this).attr("checked") == true) 
    { 
     $("input").parent().parent("input[name=attended]").attr("checked","yes"); 
    } 
});  
}); 
</script> 

<table class="BookTable adj-table"> 
<tr> 
<td>Joe</td> 
<td>Bloggs</td> 
<td><input name="booking" id="booking" type="checkbox" value="1" /></td> 
<td><input name="attended" id="attended" type="checkbox" value="1" /></td> 
</tr> 
<tr> 
<td>Dave</td> 
<td>Smith</td> 
<td><input name="booking" id="booking" type="checkbox" value="1" /></td> 
<td><input name="attended" id="attended" type="checkbox" value="1" /></td> 
</tr> 
</table> 

Jusqu'à présent, je ne peux pas sembler obtenir la sélection de toutes les cases.

+0

Toujours * inclure * votre code dans la question. Un lien est bon, mais les questions et réponses de StackOverflow devraient être autonomes (et les gens ne devraient pas avoir à aller ailleurs pour lire votre question). –

+0

Les attributs 'id' doivent être uniques dans le document. Dans cet exemple, ils ne sont même pas utilisés, vous pouvez donc les supprimer complètement. – nickf

+2

Les attributs 'id' ** doivent ** être uniques. Non "devrait" à ce sujet. :-) –

Répondre

0
$(".BookTable :checkbox").click(function(){ 
    if ($(this).is(":checked")) 
     $(this).parents("tr").find(":checkbox").attr("checked", "checked"); 
    else 
     $(this).parents("tr").find(":checkbox").removeAttr("checked"); 
}); 
+0

Il n'y a pas besoin de cela, '.attr (" checked ", bool)' fonctionne dans * chaque * navigateur, vous confondez le DOM avec le balisage HTML, ce sont des choses nettement différentes. –

+0

Merci les gars tout cela semble bien fonctionner lorsqu'il est testé. Celui-ci correspondait le mieux à mes besoins car il ne décoche pas les deux cases quand il est désélectionné. – Sam

3

Vous pouvez utiliser .closest() pour monter à l'intérieur, comme <tr> puis .find() entrées ceci:

$(".BookTable :checkbox").change(function() { 
    $(this).closest("tr").find(":checkbox").attr("checked", this.checked); 
}); 

You can test it out here. Si vous voulez seulement vérifier mais pas décocher l'autre, il suffit d'ajouter un if()like this:

$(".BookTable :checkbox").change(function() { 
    if(this.checked) 
    $(this).closest("tr").find(":checkbox").attr("checked", true); 
}); 
+0

ne définit pas l'attribut 'checked' à quoi que ce soit le fait vérifier dans certains navigateurs? – hunter

+0

@hunter - Non, c'est un attribut booléen –

+0

Dans IE si vous définissez 'checked =" false "' il est toujours vérifié – hunter

0

Vous ne pouvez pas avoir deux id avec le même nom, vous devriez en faire une classe