Free Trial

Safari Books Online is a digital library providing on-demand subscription access to thousands of learning resources.


  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • DownloadDownload
  • PrintPrint
Share this Page URL
Help

Chapter 10. HTML Form Enhancements from ... > (De)selecting All Checkboxes Using a...

10.6. (De)selecting All Checkboxes Using a Single Toggle

10.6.1. Problem

You need to select and deselect all checkboxes using a single toggle, in this case another checkbox. Additionally, that toggle should automatically switch states if some (or all) of the checkboxes are selected individually:

<fieldset>

    <legend>Reasons to be happy</legend>

    <input name="reasons" id="toggleAllReasons" type="checkbox" class="toggle" />
					<label for="toggleAllReasons" class="toggle">Select All</label>

    <input name="reasons" id="iwokeup" type="checkbox" value="iwokeup" />
    <label for="iwokeup">I woke up</label>

    <input name="reasons" id="health" type="checkbox" value="health" />
    <label for="health">My health</label>

    <input name="reasons" id="family" type="checkbox" value="family" />
    <label for="family">My family</label>

    <input name="reasons" id="sunshine" type="checkbox" value="sunshine" />
    <label for="sunshine">The sun is shining</label>

</fieldset>

					  


  

You are currently reading a PREVIEW of this book.

                                                                                        

Get instant access to over
$1 million worth of books and videos.

  

Start a Free Trial