XNAT Documentation
XNAT Documentation
Breadcrumbs

panel.select.menu

Description

Creates a <select> element, its child <option> elements and associated wrapper elements styled for XNAT.

Spawner Widget Name 

kind: panel.select.menu

JavaScript Method 

XNAT.ui.panel.select.menu()

Configuration Options

Includes options available to all Spawner elements.

selectMenu:
    kind: panel.select.single
    name: fooSelect
    label: I Choose You!
    id: foo-input
    value: ?? XNAT.data.fooValue
	options:
		pika:
			label: Pikachu
			value: pikachu
			title: I choose you!
			selected: true
		squirtle:
			label: Squirtle
			value: squirtle

Properties

Name

Value

Description

kind

panel.select.single

Spawner widget type - creates a <select> element and child <option> elements 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

  • 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, which MUST return a 'stringable' value (string, number, boolean, or array)

  • 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)

options

(object map)

Object containing definitions for the menu options.

options[option].label

(string)

Text label for this option.

options[option].value

(string)

Value for this option - if this value matches the value on the <select> element, it will be selected

options[option].selected

(boolean)

Explicitly set this option to be selected - overrides value matching

options[option].element

(object)

Other properties and attributes that will be directly added to this option element.