Select/Unselect ALL Checkboxes

Select/Unselect ALL Checkboxes - Printable Version

+- Hack Forums (https://hackforums.net)
+-- Forum: Tech (https://hackforums.net/forumdisplay.php?fid=444)
+--- Forum: Webmasters (https://hackforums.net/forumdisplay.php?fid=141)
+---- Forum: Website Construction (https://hackforums.net/forumdisplay.php?fid=50)
+---- Thread: Select/Unselect ALL Checkboxes (/showthread.php?tid=3705283)

Select/Unselect ALL Checkboxes - ExaNet - Aug 20, 2013

I have tried probably over around 10 different Javascript and JQuery scripts for this and haven't been able to get one to work. This is my current script:

Here's the JQuery import...

Code 
<html>

<head><script src="//ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script></head></html>

Here's the function...

Code 
<script>

function toggleChecked(status) {

$("#checkboxes input").each( function() {

$(this).attr("checked",status);

})</script>

And here's the HTML...

Code 
<input type="checkbox" onclick="toggleChecked(this.checked)"> Select / Deselect All

<div id="checkboxes">

<input type="checkbox" class="checkbox" />

<input type="checkbox" class="checkbox" />

<input type="checkbox" class="checkbox" />

</div>

It makes all of the check boxes but when you click the select all, it doesn't do a thing to the other boxes.

* - Dave85 - Aug 20, 2013

You forgot to close your function's brace.
Why not just using something simple like this http://jsfiddle.net/xHCwJ/

* - ExaNet - Aug 20, 2013

(Aug 20, 2013 09:32 PM)Dave85 Wrote: You forgot to close your function's brace.
Why not just using something simple like this http://jsfiddle.net/xHCwJ/

The fiddle you posted didn't work either. :/

The code I added:

Code 
<script language="javascript">

$('#checkall:checkbox').change(function () {

    if($(this).attr("checked")) $('input:checkbox').attr('checked','checked');

    else $('input:checkbox').removeAttr('checked');

});</script>

<input type="checkbox" name="all" id="checkall" />Check All</br>

<input type="checkbox" class="cb-element" /> Checkbox  1</br>

<input type="checkbox" class="cb-element" /> Checkbox  2</br>

<input type="checkbox" class="cb-element" /> Checkbox  3

* - Dave85 - Aug 20, 2013

I updated with a new fiddle:http://jsfiddle.net/xHCwJ/388/
Also use <script type="text/javascript"> not <script language="javascript">
And you call the script after page loaded.

* - ExaNet - Aug 20, 2013

(Aug 20, 2013 11:12 PM)Dave85 Wrote: I updated with a new fiddle:http://jsfiddle.net/xHCwJ/388/
Also use <script type="text/javascript"> not <script language="javascript">
And you call the script after page loaded.

It's still not working. :(

Like I said, I've tried sooo many different scripts. I have no idea what's wrong.

* - Dave85 - Aug 20, 2013

I guess you wait me to post code ?

Code 
<!doctype html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>Test</title>

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

<script type="text/javascript">

$(document).ready(function(){

    $('#checkall').on('click', function () {

  $("#yourform").find(':checkbox').prop('checked', this.checked);

        });

})

</script>

</head>

<body>

<form id="yourform">

<input type="checkbox" name="all" id="checkall" />Check All</br>

<input type="checkbox" class="cb-element" /> Checkbox  1</br>

<input type="checkbox" class="cb-element" /> Checkbox  2</br>

<input type="checkbox" class="cb-element" /> Checkbox  3

</form>

</body>

</html>

* - ExaNet - Aug 20, 2013

(Aug 20, 2013 11:28 PM)Dave85 Wrote: I guess you wait me to post code ?

Code
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Test</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('#checkall').on('click', function () { $("#yourform").find(':checkbox').prop('checked', this.checked); }); }) </script> </head> <body> <form id="yourform"> <input type="checkbox" name="all" id="checkall" />Check All</br> <input type="checkbox" class="cb-element" /> Checkbox 1</br> <input type="checkbox" class="cb-element" /> Checkbox 2</br> <input type="checkbox" class="cb-element" /> Checkbox 3 </form> </body> </html>

I put exactly every thing you have there into file and it still isn't working. Do you think it's because it's a .php file?

* - Dave85 - Aug 20, 2013

just save it as file.html and then open.

* - ExaNet - Aug 20, 2013

(Aug 20, 2013 11:38 PM)Dave85 Wrote: just save it as file.html and then open.

That's what I did. And I just said it fucks up all of my other stuff. In uBot, it does what I'm wanting it to do. Select users from a table based on attributes. And it was working in .php file type. So there should be a way to get it to work without renaming it to .html right?

This is what it does when I rename it to .html.

[Image: c902ab5bbd4050bfaa6fc631cdac0822.png]

* - Dave85 - Aug 21, 2013

Fit the previous script with yours, dont change anything.

* - ExaNet - Aug 21, 2013

(Aug 21, 2013 12:29 AM)Dave85 Wrote: Fit the previous script with yours, dont change anything.

I did! And I know I didn't mess it up cause when I changed the extension to .html the checkboxes worked fine! It just screwed up everything else.