Enabling/Disabling Buttons

One of the overlooked attributes of buttons is the disable attribute. This attribute will disable the button until you allow it to be enabled. You can change the attribute to be from either a set amount of time or until an event happens, like a check box is checked if the user agrees to a statement or terms and services that a site provides.

<script language="Javascript" type="text/javascript">
 function enable(){
  if (document.agreement_form.agreed.checked==''){
   document.agreement_form.submit_button.disabled=true
  }else{
   document.agreement_form.submit_button.disabled=false
  }
 }
</script>

.....
 <form name="agreement_form">
 <input type="checkbox" name="agreed" onchange="enable()">Do you agree that the sky is blue?
 <br>
 <input type="submit" value="Submit" disabled name="submit_button">

Let's go over the HTML first, then the JavaScript part of the code. With the HTML, we have a form named agreement_form. In this form, there are to input elements, one is a check box, the other is a submit button. The submit button is named submit_button and is disabled. The check box is named agreed and has the JavaScript even onchange, which will run the enable function when changed.
The JavaScript is just one function. The purpose of this function is to enable, or disable the submit_button element, based on the status of the agreed element in the form named agreement_form. First thing this function does is check the status of the agreed element, to verify if it is checked or unchecked. If the status is not checked, then it disables the submit_button element in that the agreement_form, in this case our submit button. When the agreed element is checked, then the script enables the submit button. Below is an example of how the script should work.