Quad Design Widgets

quad.mixed quad.symbol quad.print quad.rtr quad.dimmer quad.color quad.shutter quad.blind quad.playercontrol quad.stateswitch quad.select quad.input


quad.input

Displays an input field

Parameters
{{ quad.input(id, item, type, min, max, step, place1, place2, linetext, columntext, column_order) }}
id
unique id for this widget (optional)
item
an item, sent values are:
- date & dateflip: Date object resp. ISO 8601 - e.g. '2017-11-29T23:00:00.000Z'
- time & timeflip: String with 24hr clock - e.g. '18:31:27'
- duration & durationflip: Number of seconds
- any other: Entered value
type
'text', 'number', 'date', 'dateflip', 'datecal', 'dateslide', 'time', 'timeflip', 'duration', 'durationflip' (optional, default: text)
min
lowest allowed value (optional)
- date & dateflip: Number of days before today
- time & timeflip: Format is 24hr clock - e.g. '18:31:27'
- duration & durationflip: in seconds
max
greatest allowed value (optional)
- date & dateflip: Number of days after today
- time, timeflip: Format is 24hr clock - e.g. '18:31:27'
- duration & durationflip: in seconds
step
step between two values (optional, no effect on date/time types)
place1
placeholder attributes for future features, etc.
place2
placeholder attributes for future features, etc.
linetext
text for the whole line (optional)
columntext
(array with) text for each column (optional)
column_order
array with numbers from 1 to 5: Reorder elements to your liking (esp. relevant for smartphones as 5 columns might be too much)
* to reverse the complete order, use [5, 4, 3, 2, 1], to reverse the last two, use [1, 2, 3, 5, 4], etc.
Example
Single input
{{ quad.input('', 'input', '', '', '', '', '', '', 'Single Input') }}
  • Single Input
Multiple input with duration and date
{{ quad.input('', ['input1', 'input2'], ['durationflip', 'date'], ['', '5'], ['', '10'], '', '', '', 'Multi Input', ['1', '2']) }}
  • Multi Input
    1
    2

Author: Stefan Widmer
Inspired by Michael W├╝rtenberger, date/time control uses JTSageDateBox

Widgets

Design

Misc