2013-02-13 14 views
11

まず、jQueryで私が絶望的であると言いたがっています。jQueryすべての子チェックボックスを選択

私は、それぞれの親のチェックボックス(と作品)を選択し、ここでのポストからいくつかのコードを見ていた:

$(function() { 
    $(":checkbox").change(function() { 
    $(this).parents().children(':checkbox').attr('checked', this.checked); 
    }); 
}); 

我々は<ul> <li>を使用してツリービュー構造を有し、各<li>はチェックボックスがあります。 私は上記の逆を行い、すべての子チェックボックスで同じチェックボックスを選択したいと思います。

これを行うには誰でも変更できますか?

<input name="Survey.Buildings[0].IsSelected" type="checkbox" value="true" checked="checked" data-val="true" data-val-required="The Selected? field is required." id="Survey_Buildings_0__IsSelected" /> 
<input name="Survey.Buildings[0].IsSelected" type="hidden" value="false" /> 
  • EDIT 2:

OK私が持っているだけで、我々は、カミソリを使用していて、各チェックボックスは、@ Html.CheckboxFor出力のラインに沿っているされるように注意すべき

HTMLを固定し、構造が今のようになります。Cbx4がCbx5 Aを確認したのであれば

<ul> 
    <li> Cbx1 
     <ul> 
      <li> Cbx 2 </li> 
     </ul> 
    </li> 
    <li> Cbx3 </li> 
    <li> Cbx4 
     <ul> 
      <li> Cbx 5 </li> 
      <li> Cbx 6 </li> 
     </ul> 
    </li> 
</ul> 

)ND 6がチェックされるだろうし、それがオフだった場合、彼らは

感謝

アンディ

+0

あなたは、いくつかの特定のHTMLスニペットを提供し、そしてときに、特定のボックスの変更にチェックすべきボックスを正確に記述する必要があります。 – nbrooks

+0

私の投稿を更新しました –

+0

もしCbx2が何も起こらないとチェックされれば、私は子供のチェックボックスをトグルしたいと思います。したがって、cbx1はcbx2を切り替えず、cbx4はcbx5と6を切り替えます。 –

答えて

27

jsFiddle Demo

$(function() { 
    $("input[type='checkbox']").change(function() { 
    $(this).siblings('ul') 
      .find("input[type='checkbox']") 
      .prop('checked', this.checked); 
    }); 
}); 
+0

問題は、jsfiddleの例で3が選択されたときに4が選択され、3の子ではないという問題です。 Cbx3が選択されています。子どもがいないため、影響を受けることは他にありません。 –

+0

はい、5と6が同じLIに存在する必要があります。これは私の問題になります。私はHTMLを修正します。 –

+0

私は自分の投稿を更新して、HTMLの見た目を反映させました。ご覧のように、CBx5とCBX6はCBX4リスト内の子リストになりました。それは理にかなっていますか? –

0
$(function() { 
    $(":checkbox").change(function() { 
    $(this).children(':checkbox').attr('checked', this.checked); 
    }); 
}); 

ないあなたの質問には本当に明確なチェックを外すことだろうが、あなたは(親を除去することによって、もう一度試してください上記のように。

関連する問題