panel.form

Description

Creates a <form> element styled as a panel with "Submit" and "Reset" buttons. This element is a container that other Spawner elements are spawned into.

Spawner Widget Name

CODE

kind: panel.form

JavaScript Method

CODE

XNAT.ui.panel.form()

Configuration Options

CODE

adminInfo:
    kind: panel.form
    id: admin-info
    name: adminInfo
    label: Admin Information
    method: POST
    [contentType]: json
    [url]: /xapi/siteConfig
    [action]: /xapi/siteConfig/batch
    [load]: XNAT.data.siteConfig
    [refresh]: /xapi/siteConfig
    contents:
        ${adminEmail}

Properties

Name	Value	Description
kind	panel.form	Spawner widget type - creates a <form> element styled as a panel with "Save" and "Discard Changes" buttons in the footer.
name	(string)	Arbitrary, but meaningful, name for this form panel.
label	(string)	Form header text.
id	(string)	Value for spawned element's id attribute.
method	GET, POST, PUT	Data submission method - defaults to POST.
contentType	json, form	How is data sent? json - submit stringified object map of form elements and their values form - submit form data
url	URL string	Load and submit data using a single url. If the same url can be used to populate values into the form fields, you can use a single property with the URL used for that.
action	(REST URL)	URL for data submission. URLs starting with a slash will be resolved to the site root, adding server context if necessary.
load	(object, url, js)	Where are values pulled from when the form loads? Object - namespaced global JavaScript object that contains properties with names that match form element names URL - REST URL that returns an object with property names matching form element names JS - JavaScript code to eval() to retrieve data object There's a 'special' syntax that can be used to specify what kind of value is used for the 'load' property (object, url, or js). `load: ?? XNAT.data.object - ??` prefix will parse the object path and retrieve the data, if it exists `load: !? XNAT.data['object.with.periods.in.its.name'] - !?` prefix will do an evil JS eval `load: $? /path/to/get/data - $?` prefix will do a REST call to retrieve form values Returned data values will be inserted into form elements with name attribute values that match the property names. For example, if this object is returned… JS `{ "adminEmail": "you@yoursite.org", "emailAllowNonuserSubscribers": true, "emailPrefix": "XNAT", "host": "localhost" }` …the values will be set on matching elements… XML `<input type="text" name="adminEmail" value="you@yoursite.org"> <input type="checkbox" name="emailAllowNonuserSubscribers" value="true" checked="checked"> <input type="text" name="emailPrefix" value="XNAT"> <input type="text" name="host" value="localhost">` …that's the simplified version anyway.
refresh	URL	URL from which data is (re)loaded after form is submitted or reset. Values are inserted the same way as the `load` method.
contents	Spawner object(s)	One or more Spawner element config objects that will be inside this parent element.