jquery - Javascript Selectbox Select All Feature -

jquery - Javascript Selectbox Select All Feature -

i tried add together select function on buttons there problem jquery.min files.

i have these on header.php page;

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script>

and i'm using these code select function;

<script type="text/javascript"> function toggle(source) { checkboxes = document.getelementsbyname('foo'); for(var i=0, n=checkboxes.length;i<n;i++) { checkboxes[i].checked = source.checked; } } </script>

when remove javascript includes on header.php , add together these includes on anket.php, select boxes thing working other things not (we utilize jquery few things). need create both work.

here html;

<table class="table table-bordered table-check"> <thead> <tr> <th><input type="checkbox" onclick="toggle(this)" class="styled"></th> <th align="center">soru</th> <th align="center">durum</th> </tr> </thead> <tbody> <tr> <td><input type="checkbox" name="foo" class="styled" /></td> <td align="center">aylık kazancınız nedir?</td> <td align="center">aktif</td> </tr> <tr> <td><input type="checkbox" name="foo" class="styled" /></td> <td align="center">cinsiyetiniz nedir?</td> <td align="center">pasif</td> </tr> </tbody> </table>

thank you.

you may seek this:

html

<table class="table table-bordered table-check"> <thead> <tr> <th> <input type="checkbox" class="styled" id="allchk" /> </th> <th align="center">soru</th> <th align="center">durum</th> </tr> </thead> <tbody> <tr> <td> <input type="checkbox" name="foo" class="styled" /> </td> <td align="center">aylık kazancınız nedir?</td> <td align="center">aktif</td> </tr> <tr> <td> <input type="checkbox" name="foo" class="styled" /> </td> <td align="center">cinsiyetiniz nedir?</td> <td align="center">pasif</td> </tr> </tbody> </table>

script

$(function(){ $("#allchk").on('change', function(){ $("input[name=foo]:checkbox").prop('checked', $(this).prop('checked')); }); $("input[name=foo]:checkbox").on('change', function(){ $("#allchk").prop('checked', 0 === $("input[name=foo]:not(:checked)").length); }); })

javascript jquery