XForms/Checkbox

Motivation

You have a boolean true/false value and want an input control to have a simple checkbox for a yes/no or true/false answer.

Method

We will use a standard input control but use the bind statement to bind the instance to a boolean datatype. We will do this in two ways, one using a bind without an ID and using the bind with an id so that we can reference the bind statement.

Note that checkboxes can also be demonstrated by using the xf:select control. But in that case a series of space-delimited values is stored in the value associated with the control.

Screen Image

Boolean Checkbox Using Input Control

Link to XForms Application

Load XForms Application

Sample Program

<html
   xmlns="http://www.w3.org/1999/xhtml"
   xmlns:xf="http://www.w3.org/2002/xforms"
   xmlns:xs="http://www.w3.org/2001/XMLSchema">
   <head>
      <title>XForms Checkbox Demo</title>
      <style type="text/css"><![CDATA[body {font-family: Helvetica, sans-serif;}]]>
      </style>
      <xf:model>
         <!-- load the module test data into the model -->
         <xf:instance xmlns="">
            <data>
               <bool1>true</bool1>
               <bool2>false</bool2>
            </data>
         </xf:instance>
         <!-- Here is where we indicate the datatypes of the instance variables -->
         <xf:bind ref="bool1" type="xs:boolean"  />
         <xf:bind id="bool2" ref="bool2" type="xs:boolean"  />
      </xf:model>
   </head>
   <body>
      <h1>XForms Checkbox Demo</h1>
      <xf:input ref="bool1">
         <xf:label>Bool 1: </xf:label>
      </xf:input>
      <br />
      <!-- use a named binding -->
      <xf:input bind="bool2">
         <xf:label>Bool 2: </xf:label>
      </xf:input>
      <br />
      <xf:output ref="bool1">
         <xf:label>Bool 1: </xf:label>
      </xf:output>
      <br />
      <xf:output bind="bool2">
         <xf:label>Bool 2: </xf:label>
      </xf:output>
   </body>
</html>

Next Page: Select1 | Previous Page: Textarea with style
Home: XForms