Check Boxes (continued)

When you checked two or more of the boxes on the previous page and sent the form, you got a result like the one on the right. As you can see, the one form field, extraInfo, can have more than one value.

Here's what we got from your form:

In this case, it was no problem. However, some databases or programs that you send information to may allow only one value per field. To use checkboxes effectively in such an instance, you have to make three differently-named checkboxes, each of which has only one value.

Here's the revised HTML to split the “one-group-of-three” checkboxes into “three-groups-of-one.” From the user's point of view, the form looks exactly the same. Check two or more of the boxes, and send the form to see what gets sent in to the server.

<form action="showInfo.cgi" method="post">
  Send me more information about: <br />
  <input type="checkbox" name="Computer-Zine"
     value="yes" checked="checked" /> Computer-Zine
  <br />
  <input type="checkbox" name="Fisher-Zine"
     value="yes" /> Fisher-Zine
  <br />
  <input type="checkbox" name="Cat-O-Zine"
     value="yes" /> Cat-O-Zine
  <br />
  <input type="submit" value="Send Data">

Send me more information about:

Which way should you implement checkboxes? Whichever way best suits your particular application.