XNAT Documentation
XNAT Documentation
Breadcrumbs

panel.input.switchbox

Description

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 

XNAT.ui.panel.input.switchbox()

Configuration Options 

switchboxInput:
    kind: panel.input.switchbox
    name: fooSwitch
    label: Flip The Switch
    id: foo-switch
    value: ?? XNAT.data.fooValue
	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"
    after:
        smallTxt:
            tag: small.msg

Properties

Name

Value

Description

kind

panel.form

Spawner 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

    • ?? XNAT.data.siteConfig.adminEmail

    • ?? XNAT:data:siteConfig:security.channel

  • js - eval'd JavaScript, prefixed with !? - can be a js variable or expression

  • 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

description

(string-html)

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