Description

Creates an <input type="text"> element and associated wrapper elements styled for XNAT.

Spawner Widget Name

kind: panel.input.text

JavaScript Method

XNAT.ui.panel.input.text()

Configuration Options

textInput:
    kind: panel.input.text
    name: fooInput
    label: Input Ur Txt Here
    id: foo-input
    value: ?? XNAT.data.fooValue
    validation: required alphanum onblur
    before: "Text or HTML to insert before the input element"
    after:
        smallTxt:
            tag: small.msg
            

Properties

NameValueDescription
kindpanel.input.textSpawner 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

  • 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
    • !? $$('!#other-input').value* - inserts value of '#other-input'

    • !? Date.now() - 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)


validation(string)String containing options as a space-separated list for validating the input.
before(string/objects)Elements that will render before the panel element. This is useful for inserting ad-hoc content if needed.
after(string/objects)Elements that will render after the panel element.