Checkbox HTML Forms with Nag

Is current?: 
Yes

The checkbox-nag template checkbox-nag.htm is a type of HTML form that is a variant of the checkbox.  The nag functionality uses Javascript code to alert the user if they have not chosen at least one check box for each item.  This nag alerts the user once, and after that, the user is free to proceed to the next task, even without responding to the items.

The use of the fake button and the distinction between the fake button and real button is explained in the dropdown-nag entry. The onclick event handler in the fake button on line 81 is the function donag().  When the user clicks on the Continue button, donag() checks if the user had previously clicked this button.  If this is the first click and if the responses are incomplete, then the user is alerted.  If this is the second click, or if the items have been completed, then cleanupcheckboxes()  is run prior to form submission using document.form1.submit().  The donag()for checkbox is below:

<script type="text/javascript">

  var nnag=0;

  function donag() {

   nnag++;               // increment by 1

   var allanswered=true; // assume everything is complete

  if (!document.form1.cbitem1a.checked && !document.form1.cbitem1b.checked // scan item1
    && !document.form1.cbitem1c.checked && !document.form1.cbitem1d.checked

    && !document.form1.cbitem1e.checked && !document.form1.cbitem1f.checked    
    && !document.form1.cbitem1g.checked) allanswered=false;


  if (!document.form1.cbitem1a.checked && !document.form1.cbitem1b.checked // scan item2
    && !document.form1.cbitem1c.checked && !document.form1.cbitem1d.checked

    && !document.form1.cbitem1e.checked && !document.form1.cbitem1f.checked    
    && !document.form1.cbitem1g.checked) allanswered=false;


  if (!allanswered && nnag<=1) // condition to produce an alert
       alert("Please check at least one option on each item.\nThis reminder will appear once.");

       else { cleanupcheckboxes(); document.form1.submit();} // else cleanup and submit
   }

 </script>

Clearly, this code is awkward and errors are easy to introduce.  Use of checkboxes is not recommended unless it is limited to 2 or 3 items per page.