HTML checkbox onclick called in Javascript

Question

I am having a bit of trouble trying to figure out how to get a certain part of my code to work    lt input type  checkbox  id  check all 1  name  check all 1  title  Select All  onclick  selectAll document wizard form  this    gt   lt label for  check all 1  onclick  toggleCheckbox  check all 1    return false   gt Select All lt  label gt    This is my HTML which works as it should  clicking the text will click the box   The javascript for it is pretty simple   function toggleCheckbox id        document getElementById id  checked    document getElementById id  checked      However I want the onclick to happen for the input when the label is what makes the checkbox to be clicked  At this current time the onClick js does not go  What is one suggestion on how to do this  I tried to add the onclick of the input to the onclick of the label but that doesn t work    Any suggestions solutions would be wonderful

User · Answer

Label without an onclick will behave as you would expect  It changes the input  What you relly want is to execute selectAll   when you click on a label  right  Then only add select all to the label onclick  Or wrap the input into the the label and assign onclick only for the label   lt label for  check all 1  onclick  selectAll document wizard form  this    gt     lt input type  checkbox  id  check all 1  name  check all 1  title  Select All  gt    Select All  lt  label gt

User · Answer

jQuery has a function that can do this    include the following script in your head    lt script type  text javascript  src  http   ajax googleapis com ajax libs jquery 1 4 0 jquery min js  gt  lt  script gt     or just download the jQuery js file online and include it locally  use this script to toggle the check box when the input is clicked   var toggle   false      INPUTNAMEHERE   click function                input type checkbox    attr  checked   toggle           toggle    toggle          That should do what you want if I understood what you were trying to do

User · Answer

How about putting the checkbox into the label  making the label automatically  click sensitive  for the check box  and giving the checkbox a onchange event    lt label        gt  lt input type  checkbox  onchange  toggleCheckbox this         gt    function toggleCheckbox element        element checked    element checked       This will additionally catch users using a keyboard to toggle the check box  something onclick would not

User · Answer

You can also extract the event code from the HTML  like this      lt input type  checkbox  id  check all 1  name  check all 1  title  Select All    gt   lt label for  check all 1  gt Select All lt  label gt    lt script gt  function selectAll frmElement  chkElement                 document getElementById  check all 1   onclick   function         selectAll document wizard form  this      lt  script gt

[javascript] HTML checkbox onclick called in Javascript

Examples related to javascript

Examples related to input

Examples related to checkbox

Examples related to label

Examples related to onclick