Link to home
Start Free TrialLog in
Avatar of whaleyk
whaleyk

asked on

checkbox if checked hide submit button and display message

Hello experts, i've been trying to modify this but no luck.  Currently the checkbox "turns on" the button, i want the button displayed unless user checks the box, at which point button should disapear and be replaced with a message.

Thanks so much,
K

=========================================================================
 <strong>Is this part of the commission hierarchy?</strong> <br>
Check if YES <input name="commission" type="checkbox" value="y" onclick="document.getElementById('btnSubmit').style.display=(this.checked?'inline':'none')">  <br><br>
<!---If yes, display an alert that they cannot submit and hide the button below. --->
<input style="display:none" id="btnSubmit" type="submit" value="Continue >>" name="btnSubmit">
ASKER CERTIFIED SOLUTION
Avatar of mvan01
mvan01
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of hemebond
hemebond

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
      <head>
            <title>Disable submit button with checkbox</title>
      </head>
      <body>
            <form action="" method="post">
                  <fieldset>
                        <div>
                              <label for="commission">This is part of the commission hierarchy</label>
                              <input id="commission" name="commission" type="checkbox" value="y">
                        </div>
                        <input id="commission-submit" type="submit" value="continue">
                  </fieldset>
            </form>
            
            <script type="text/javascript">
                  var checkbox = document.getElementById('commission');
                  checkbox.addEventListener('click',toggleSubmit,false);
                  
                  function toggleSubmit()
                  {
                        document.getElementById('commission-submit').disabled = checkbox.checked;
                  }
            </script>
      </body>
</html>