Skip to main content
Skip table of contents



Creates an <input type="checkbox"> element and associated elements to create a toggle switch that controls a checkbox element.

Spawner Widget Name

kind: panel.input.switchbox

JavaScript Method


Configuration Options

    kind: panel.input.switchbox
    name: fooSwitch
    label: Flip The Switch
    id: foo-switch
    value: ??
	checked: true
    onText: Yes
    offText: No
	description: "This describes what this switch turns on or off."
    before: "Text or HTML to insert before the input element"
            tag: small.msg


kindpanel.formSpawner widget type - creates an <input> element with other necessary elements for proper styling and functionality.
name(string)Name attribute for this input, which must match the property name used for data loading and submission.
label(string)Label element for input.
id(string)Value for spawned element's id attribute.
value(string, obj, js, url)

Existing value for input - can be an explicit value as a string, a value looked up from a JavaScript object property, or a REST URL that returns a single value

  • string - explicitly set a value
  • obj - property value of a namespaced JavaScript object, prefixed with ??, using periods or colons as path separators
    • ??
    • ??
  • js - eval'd JavaScript, prefixed with !? - can be a js variable or expression
  • !? $$('!#other-input').value* - inserts value of '#other-input'

  • !? - inserts current time in milliseconds

  • !? PAGE.username - inserts username from PAGE object (available on JSP pages)

  • url - REST URL used to retrieve value, prefixed with $?
    • $? /xapi/siteConfig/adminEmail
    • $? /xapi/users/profiles/admin/enabled

* "What's with the wacky syntax?"

Given this expression:

!? $$('!#other-input').value

  • !? - tells the panel.input Spawner method that we're doing an eval() to get the form values
  • $$ - a special JavaScript function used in XNAT to retrieve DOM elements or jQuery-wrapped elements
  • !# - a special selector syntax used with the $$ function to retrieve the raw DOM element by id (this eliminates an unnecessary jQuery function call to just get the value of an input)

onText(string)Text string to use when switch is in "on" position.
offText(string)Text string to use when switch is in "off" position.
validation(string)Space-separated list of validation options

Brief description of what this element is for and what it does. This can contain HTML so links, images, etc. can be included as well.

HTML Output

JavaScript errors detected

Please note, these errors can depend on your browser setup.

If this problem persists, please contact our support.