Difference between revisions of "Input"

From HSYCO
Jump to navigation Jump to search
Line 13: Line 13:
 
*'''position''': the object's position. Use the pixels or rows and columns coordinates format
 
*'''position''': the object's position. Use the pixels or rows and columns coordinates format
 
*'''css''': optional. Defines the CSS style for the input field
 
*'''css''': optional. Defines the CSS style for the input field
−
*'''type''': optional. Defines the input type:
+
*'''type''': optional. Defines the input type, see [[#Input attributes|inputtype UI attribute]]
−
** input - default behaviour
 
−
** multiline - for input fields with more than a line. Use the height attribute on the css parameter to set the size
 
−
** password - hides typed characters
 
  
 
== Syntax ==
 
== Syntax ==
Line 26: Line 23:
 
{{UI Object Attributes (Common)}}
 
{{UI Object Attributes (Common)}}
 
{{UI Object Attributes (Field)}}
 
{{UI Object Attributes (Field)}}
 +
===Input attributes===
 +
{| class="wikitable"
 +
!Name
 +
!Value
 +
!Description
 +
|-
 +
 +
|value
 +
|string
 +
|Input value
 +
|-
 +
 +
|maxlenght
 +
|number
 +
|Specify the maximum length that can be typed
 +
|-
 +
 +
|rowspan="2"|eraseicon
 +
|true
 +
|Show an erase icon that can be clicked to quickly erase the input's content
 +
|-
 +
|false
 +
|Default: no erase icon
 +
|-
 +
 +
|style
 +
|CSS style
 +
|Set the field's CSS style
 +
|-
 +
 +
|helptext
 +
|string
 +
|Text to show when the field is empty
 +
|-
 +
 +
|changedelay
 +
|number
 +
|Sets the delay in milliseconds by which changes are detected. If the field is working in autosend mode, this value determines the delay between the last button press and the value being sent to the server
 +
|-
 +
 +
|validatekey
 +
|regular expression
 +
|A regular expression to be validated on a keypress. E.g. "[a-z]" will allow only lowercase letters
 +
|-
 +
 +
|validatevalue
 +
|regular expression
 +
|A regular expression to be validated before the value is sent to the server. If the expression doesn't match the value, the previous value will be restored and the input will flash in red
 +
|-
 +
 +
|rowspan="3"|inputtype
 +
|input
 +
|Default behaviour
 +
|-
 +
|multiline
 +
|for input fields with more than a line. Use the height attribute on the css parameter to set the size
 +
|-
 +
|password
 +
|hides typed characters
 +
|-
 +
 +
|}

Revision as of 11:59, 22 January 2014

Note  For a description and a complete list of UI Objects, see UI Objects.

Input field that allows the user to input a text. Can be used with a submit button.

Requires an ID.

For a tutorial on using this object, see Working with Forms

UI Object input.png

Parameters

  • id: the object's ID, used by UISets
  • position: the object's position. Use the pixels or rows and columns coordinates format
  • css: optional. Defines the CSS style for the input field
  • type: optional. Defines the input type, see inputtype UI attribute

Syntax

(input!id <position>; [<css>]; [<type>])

E.g. 

(input!myinput r1c1; color:blue; password)

UI Attributes

Common attributes

Name Value Description
pos x<x>y<y> Position specified as x/y coordinates. E.g. x-5y10
visible true Default. Show the object
false Hide the object
blink true | slow Blink the object at a slow speed
fast Blink the object at a fast speed
false Stop the blinking
opacity 0.0 ... 1.0 Object opacity from 0 (not visible) to 1 (fully visible)
rotation 0 ... 360 Object rotation in degrees. Images are rotated around the center point, all other objects are rotated around the top left corner

Field attributes

Name Value Description
enabled true Field is enabled
false Field is disabled
autosend true Automatically sends the value on changes. It's the default behaviour when there are no submit objects on the page or in a parent container (if the field is inside a container).
false Won't send the value on changes. It's the default behaviour when there's a submit object on the page or in a parent container.
focus (deprecated, use page's focus attribute instead) true Focus the field. Only a single object should have this attribute at "true".
false Reset focus
rollback true Restores the previously saved value.
rollbackenabled true Automatically restores the previous value on an error (if the value isn't valid or the remote request resolved in an error).
false Won't restore the value on errors.
error true Manually shows an error feedback on the field (won't modify the current field value).
false Hides the error visualization.

Input attributes

Name Value Description
value string Input value
maxlenght number Specify the maximum length that can be typed
eraseicon true Show an erase icon that can be clicked to quickly erase the input's content
false Default: no erase icon
style CSS style Set the field's CSS style
helptext string Text to show when the field is empty
changedelay number Sets the delay in milliseconds by which changes are detected. If the field is working in autosend mode, this value determines the delay between the last button press and the value being sent to the server
validatekey regular expression A regular expression to be validated on a keypress. E.g. "[a-z]" will allow only lowercase letters
validatevalue regular expression A regular expression to be validated before the value is sent to the server. If the expression doesn't match the value, the previous value will be restored and the input will flash in red
inputtype input Default behaviour
multiline for input fields with more than a line. Use the height attribute on the css parameter to set the size
password hides typed characters
Retrieved from "https://wiki.hsyco.com/3.8/index.php?title=Input&oldid=1204"